Язык гипертекстовой разметки, также известный как HTML, используется для создания веб-приложений. Теги HTML, обычно известные как элементы, являются наиболее важным аспектом языка HTML. Теги HTML встраивают и отображают содержимое или информацию на веб-страницах. Существует два типа тегов HTML: пустые теги и теги-контейнеры.
В этом блоге рассказывается, как работать с пустыми тегами и тегами-контейнерами в HTML.
Пустые теги
Пустые теги также известны как « синглтон ' или ' пустота ” теги. Тег void никогда не содержит содержимого, но можно указать атрибуты. Эти теги не имеют закрывающего тега и могут содержать обратную косую черту в теге. Примерами пустых тегов являются «
», «», «», «
Синтаксис
Синтаксис для упоминания пустых элементов в HTML следующий:
< пустой тег />
Чтобы увидеть, как работать с пустыми тегами, посмотрите пример ниже. “
” известен как тег разрыва строки и используется для разрыва строки:
< п > Пустые теги HTML < бр > Линия сломать Ярлык п >
Вывод показывает, что «
” разорвал строку:
Мы можем добавить свойства стилей CSS к тегам HTML. “ <час> ” — это еще один пустой элемент, который добавляет на страницу горизонтальную линию:
< п > Пустые теги HTML< час стиль знак равно 'border-top: 3px пунктирный красный;' > Линия сломать Ярлык
п >
“ верхняя граница » Свойство CSS применяется к « <час> ” с тремя значениями, одно из которых – ширина границы, равная “ 3 пикселя », стиль границы установлен как « пунктирная ” и цвет границы.
Вывод
До сих пор мы обсуждали пустые теги HTML. Теперь мы рассмотрим теги контейнера HTML в следующем разделе.
Теги контейнера
Теги контейнера HTML состоят из трех частей: начальных тегов, содержимого и конечных тегов. Синтаксис тега контейнера HTML приведен ниже:
< start_day > Содержание конечный тег >Ознакомьтесь с приведенными ниже примерами, чтобы узнать, как тег контейнера работает в HTML.
Пример 1: Как добавить абзац в HTML?
“ Тег используется для встраивания абзаца в документ HTML:
< п > Это тег абзаца п >Вывод
Пример 2: Как добавить заголовки в HTML?
Существует шесть уровней тегов контейнера заголовков, которые можно использовать для добавления заголовков на веб-страницу. Давайте поместим их в HTML-документ, чтобы увидеть, как они работают и выглядят на веб-странице:
< h1 > линукс h1 >< h2 > линукс h2 >
< h3 > линукс h3 >
< h4 > линукс h4 >
< h5 > линукс h5 >
< h6 > линукс h6 >
Вывод
Мы можем предоставить встроенный стиль для этих тегов. Рассмотрим приведенный ниже пример, в котором показано, как применять различные свойства стилей CSS к этим тегам:
< h1 стиль знак равно 'цвет фона: чертополох; семейство шрифтов: скоропись;' > линукс h1 >< h2 стиль знак равно 'цвет фона: пшеница; выравнивание текста: по центру;' > линукс h2 >
< h3 стиль знак равно 'цвет фона: помидор; цвет: белый;' > линукс h3 >
< h4 стиль знак равно 'семейство шрифтов: 'Требушет MS'; цвет фона: желто-зеленый;' > линукс h4 >
< h5 стиль знак равно 'цвет фона: фиолетовый;' > линукс h5 >
< h6 стиль знак равно 'цвет фона: белый дым'; > линукс h6 & гт
Вот объяснение вышеуказанных свойств:
- “ фоновый цвет » добавляет цвет к фону элемента.
- “ семейство шрифтов » регулирует стиль шрифта элемента.
- “ выравнивание текста » регулирует размещение или выравнивание текста.
Вывод
Мы показали вам, как использовать пустые и контейнерные теги HTML.
Заключение
Пустые теги и теги-контейнеры являются основными компонентами HTML-документов, которые встраивают содержимое и информацию на веб-страницу. Пустые теги не содержат никакого содержимого и состоят только из начального тега с обратной косой чертой в конце, например
. Однако теги контейнера содержат начальный и конечный теги вместе с содержимым. В этом блоге подробно рассматривается работа пустых и контейнерных элементов в HTML.