HTML-элементы
HTML-элементы
Документы HTML определяются элементами HTML, которые относятся ко всему коду от начального тега (начальный тег) до конечного тега (конечный тег).
HTML-элементы
| стартовый тег * | содержимое элемента | конечный тег * |
|---|---|---|
| <p> | это абзац | </p> |
| <a href="default.htm"> | вот ссылка | </a> |
| <br> | Это тег новой строки |
* Открывающий тег часто называют открывающим тегом , а закрывающий тег часто называют закрывающим тегом .
Синтаксис элемента HTML
- Элементы HTML начинаются с начального тега
- Элементы HTML заканчиваются закрывающими тегами
- Содержимое элемента — это содержимое между открывающим и закрывающим тегами.
- Некоторые элементы HTML имеют пустое содержимое
- Пустые элементы закрываются в открывающем теге (заканчивается концом открывающего тега)
- Большинство элементов HTML могут иметь атрибуты
Примечание. Вы узнаете больше об атрибутах в главе HTML-атрибуты этого руководства.
Вложенные элементы HTML
Документы HTML состоят из вложенных элементов HTML, которые могут содержать другие элементы HTML.
Пример HTML-документа
пример
<!ДОКТИП HTML>
<html>
<тело>
<p>Это первый абзац. </p>
</тело>
</html>
Приведенный выше пример содержит три элемента HTML.
Разбор примера HTML
элемент <р>:
пример
<p>Это первый абзац. </p>
Элемент <p> определяет абзац в документе HTML.
Этот элемент имеет открывающий тег <p> и закрывающий тег</p>.
Содержимое элемента: Это первый абзац.
Элемент <body>:
пример
<тело>
<p>Это первый абзац. </p>
</тело>
Элемент <body> определяет тело HTML-документа.
Этот элемент имеет открывающий тег <body> и закрывающий тег </body>.
Содержимое элемента — это другой элемент HTML (элемент p).
элемент <html>:
пример
<html>
<тело>
<p>Это первый абзац. </p>
</тело>
</html>
Элемент <html> определяет весь HTML-документ.
Этот элемент имеет открывающий тег <html> и закрывающий тег</html>.
Содержимое элемента — это другой элемент HTML (элемент body).
Не забудьте закрывающий тег
Большинство браузеров также будут правильно отображать HTML, если вы забудете использовать закрывающий тег:
пример
<p>Это абзац
<p>Это абзац
Приведенный выше пример также будет нормально отображаться в браузере, поскольку закрывающий тег является необязательным.
Но на это полагаться нельзя, потому что если вы забудете использовать закрывающий тег, это может привести к непредсказуемым результатам или ошибкам.
пустой HTML-элемент
Пустой элемент HTML — это элемент HTML, не имеющий содержимого.
Пустые HTML-элементы должны быть закрыты в открывающем теге.
Пустым элементом в HTML является <br> (используется для определения разрывов строк), а элемент <br> не имеет закрывающего тега.
Пустые элементы HTML закрываются путем добавления косой черты к открывающему тегу, например <br />, который принимается HTML, XHTML и XML.
Примечание. В XHTML, XML и будущих версиях HTML все элементы должны быть закрыты, даже пустые элементы.
Совет HTML: используйте теги нижнего регистра
Поскольку теги HTML не чувствительны к регистру английских букв, <P> и <p> имеют одинаковое значение, но большинство веб-сайтов в первые годы предпочитали использовать теги HTML в верхнем регистре.
W3CSchool использует теги нижнего регистра, потому что Консорциум World Wide Web (W3C) рекомендует строчные буквы в HTML 4 и будет применять строчные буквы в будущих версиях (X)HTML .
До HTML4 стандарт HTML был довольно запутанным, поэтому код HTML в первые годы не был настолько стандартизирован, и он был бы больше похож на код XML, а главная особенность кода XML заключается в том, что теги любят использовать прописные буквы, поэтому большинство веб-сайтов любят использовать теги в верхнем регистре в первые несколько лет разработки HTML.
С ростом популярности HTML4 и даже HTML5 последующие веб-сайты следуют рекомендации HTML4 — использовать строчные буквы, поэтому большинство веб-сайтов теперь используют теги HTML в нижнем регистре.
HTML-атрибуты
HTML-атрибуты
Атрибуты — это дополнительная информация, предоставляемая HTMLэлементу .
HTML-атрибуты
- Элементы HTML могут устанавливать атрибуты
- Атрибуты могут добавлять дополнительную информацию к элементу
- Атрибуты обычно описываются в начальном теге
- Свойства всегда отображаются в виде пар имя/значение, например: name="value" .
экземпляр атрибута
Ссылки HTML определяются тегами <a>. Адрес ссылки указывается в атрибуте href :
пример
<a href="https://www.w3cschool.cn">Это ссылка с атрибутом href</a>
Значение атрибута общей ссылки атрибута HTML
Значения атрибутов всегда должны быть заключены в кавычки.
Двойные кавычки являются наиболее распространенными, но с одинарными кавычками проблем не возникает.
Совет: В некоторых отдельных случаях, например, когда само значение атрибута содержит двойные кавычки, необходимо использовать одинарные кавычки, например: name='John "ShotGun" Nelson'
Совет HTML: используйте атрибуты нижнего регистра
Атрибуты и значения атрибутов не чувствительны к регистру.
Тем не менее, Консорциум World Wide Web рекомендует атрибуты/значения атрибутов нижнего регистра в своих рекомендациях HTML 4.
Однако более новые версии (X)HTML требуют атрибутов нижнего регистра.
Справочное руководство по атрибутам HTML
Атрибуты, применимые к большинству элементов HTML, перечислены ниже:
| Атрибуты | описывать |
|---|---|
| сорт | Определите одно или несколько имен классов (имя класса) для html-элементов (имена классов импортируются из файлов стилей) |
| идентификатор | Определить уникальный идентификатор элемента |
| стиль | Определяет встроенный стиль элемента |
| заголовок | Описывает дополнительную информацию об элементе (используется как панель инструментов) |