Для проверки, валидный ли на странице код, можно использовать HTML валидатор. Аналогичный сервис также есть для проверки валидности CSS.
На самом деле я не рекомендую новичкам сильно переживать по поводу валидности кода. Современные браузеры в 95% случаев отобразят все правильно.
С другой стороны — почему-бы не делать сразу правильно? Особенно, если вы решили сделать веб-разработку своим ремеслом.
Базовая структура HTML документа
Сохраните любой текст с расширением HTML, и браузер отобразит его как веб-страницу.
Однако, чтобы эта страница стала соответствовать стандартам, нужно использовать небольшое количество обязательных элементов:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Стандартная структура HTML страницы</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <h1>Стандартная структура HTML страницы</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo, alias magnam ae non! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nostrum, natus, qui facilis accusamus enim sunt velit fuga delectus nisi quum amet quisquam! Qui dolorem perferendis suscipit tempore rem. m ipsum dolor sit amet!</p> </body> </html>
В приведенном примере есть две строки, которые сложно понять — их можно только начать использовать :)
!DOCTYPE определит, к какому HTML стандарту отностится данная страница. Приведенная в примере строка определяет наиболее общепринятый на момент написания стандарт — переходный (нестрогий) HTML 4.01.
<meta> в данном случае задает кодировку — utf8. Важно применять, поскольку при применении латиницы в документе есть большой шанс, что браузер покажет ее кракозябрами без явного указания кодировки.
Вложенные списки
Если вам нужно сложить один список в другой, то вложенный список нужно добавлять ВНУТРЬ элемента <LI>, поскольку <OL> и <UL> могут содержать только элементы <LI>.
Пример правильного использования вложенных списков в HTML странице:
<ul>
<li>Lorem ipsum dolor sit amet
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Lorem ipsum dolor sit amet</li>
</ul>
</li>
<li>Lorem ipsum dolor sit amet</li>
</ul>
Русский