Синтаксис HTML
Синтаксис языка HTML
В этой статье мы рассмотрим синтаксис HTML и как правильно записывать код языка HTML.
Структура HTML-документа
При написании HTML-кода в блокноте, желательно придерживаться одного стиля. Схема стандартного HTML-документа, выглядит следующим образом:
<!DOCTYPE html> <html> <head> <title>Название страницы<title> </head> <body> <h1>Заголовок статьи</h1> <p>Абзац статьи</p> </body> </html>
Каждый HTML-документ должен начинаться со строки <!DOCTYPE html>, она означает что код в документе будет написан на языке HTML. Затем идёт сам HTML-код, который начинается и заканчивается тегами <html> </html>.
Между тегами <html> </html> располагаются два основных блока, первый блок — это голова HTML-документа, который начинается и заканчивается тегами <head> </head>, второй блок — это тело HTML-документа, который начинается и заканчивается тегами <body> </body>.
В голове HTML-документа содержится различная служебная информация, которую пользователь не видит (кроме тега title), там находятся следующие теги:
<title> </title> — название HTML-страницы,
<meta> — мета-теги, в них содержится служебная информация о странице,
<link> — тег ссылающийся на внешние файлы, например .css, .ico и т.д.,
<script> </script> — теги могут содержать JavaScript-код или ссылаться на внешний файл .js
В теле HTML-документа обычно содержится основная информация, которую мы видим на странице, там могут находиться следующие теги:
<h1> </h1> — заголовок статьи, первого уровня,
<img> — изображение,
<p> </p> — абзац,
<a> </a> — ссылка,
<table> </table> — таблица,
<form> </form> — форма ввода данных,
и т.д.
Правила написания HTML-кода
Рассмотрим некоторые правила написания HTML-кода. Данные правила нужны для того, чтобы потом удобно было разбираться в собственном коде.
- Блочные теги которые находятся внутри других тегов, лучше размещать на одну строку ниже и на один пробел (табуляцию, как вам удобней) правее от тега в котором он размещен. Например таким образом расположены заголовок
h1и абзацp, по отношению к тегуbody, в схеме HTML-документа расположенной в начале этой статьи. -
Закрывающий и открывающий теги одного элемента, могут находится либо на одном уровне, как например теги
<body></body>, либо закрывающий тег может находится в конце текста, как например закрывающие теги элементовtitle,h1иp. -
Равнозначные между собой элементы тоже можно размещать на одном уровне, в схеме HTML-документа что расположена выше, равнозначными по отношению друг к другу, являются
headиbody,h1иp. - На самом деле, весь HTML-код можно записать в одну строку и браузер всё равно правильно покажет HTML-страницу. Правила синтаксиса языка HTML, где теги нужно записывать друг под другом и левее, существуют лишь для того, чтобы вебмастеру было удобнее создавать и изменять в дальнейшем код HTML-страницы.
Вот еще некоторые моменты, которые нужно учитывать при создании кода:
- Сколько бы вы не поставили пробелов в текстовом редакторе, браузер покажет их как один пробел.
- Переносы строк и табуляции в текстовом редакторе, не распознаются браузером.
- Если вам нужно перенести строку, которая должна быть видна на HTML-странице, то используйте тег
<br>. - Если вам нужна табуляция (например для создания "красной" строки), которая должна быть видна на HTML-странице, то используйте либо несколько спецсимволов неразрывного пробела
либо CSS-свойствоtext-indent.
Читать далее: Адреса в HTML