HTML: виды тегов
HTML – это декларативный язык, он используется для объявления структуры документа и не имеет алгоритмической составляющей.
В веб-разработке HTML применяется для создания разметки документа, которая потом стилизуется для отображения в браузере. Таким образом, если вам нужно сверстать элемент, то сначала для него пишется HTML-код (определяется структура этого элемента), затем с помощью стилей CSS оформляется внешний вид этого элемента и его расположение на странице. После этого с помощью языка JavaScript элементу может быть задана определенная функциональность, он становится интерактивным.
Теги в языке HTML
Основной и единственный структурный элемент языка HTML – это тег. Разберем их основные виды.
Формат тегов HTML:
Такие теги называются парными, так как для них указаны маркеры начала и конца тега.
У тега могут быть атрибуты, которые указываются в его открывающей части и отделяются друг от друга пробелами.
Также существуют одиночные теги, для которых закрывающая часть отдельно не указывается.
Отметим ещё одну особенность HTML – язык HTML является регистронезависимым, имена тегов и атрибутов можно записывать как в нижнем, так и в верхнем регистре.
Виды тегов
Теги языка HTML можно условно разделить на несколько категорий:
1. Теги для форматирования текста и указания ссылок
- h1, h2, h3, h4, h5, h6 – теги заголовков;
- b, em – теги для изменения начертания текста;
- ul, ol – теги для создания списков;
- a – тег для создания ссылок.
2. Теги структуры документа
- nav – тег для создания навигации по сайту;
- aside – создаёт боковую панель на сайте, где размещается неосновной контент;
- header – тег для создания шапки сайта или раздела;
- section – тег для создания раздела веб-страницы;
- div – тег, с помощью которого выделяется отдельный блок, с целью его последующего изменения;
- span – определяет строчные элементы.
3. Функциональные теги
- html – включает в себя всё содержимое страницы;
- body – раздел html-файла, где содержится техническая инфомрация;
- script – предназначен для создания/подключения скриптов;
- link – предназначен для подключения внешних файлов (шрифтов или стилей);
- meta – содержит информацию, предназанченную для поисковых систем и браузеров.
4. Теги встраиваемого контента
- img – изображение;
- audio – аудиуоконтент;
- iframe – отдельная область документа, в которую можно подгружать другие независимые документы.
5. Теги форм (для взаимодействия с пользователем)
6. Теги таблиц
Типы тегов
Каждый тег HTML принадлежит к определенной группе тегов, например, табличные теги направлены на формирование таблиц и не могут применяться для других целей.
Условно теги делятся на следующие типы:
- теги верхнего уровня;
- теги заголовка документа;
- блочные элементы;
- строчные элементы;
- универсальные элементы;
- списки;
- таблицы;
- фреймы.
- и
относятся к категории списков, но также являются и блочными элементами.
Далее рассмотрим только те теги, которые потребуются нам в дальнейшей работе.
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
Популярные рецепты
Как добавить картинку на веб-страницу?
Как добавить иконку сайта в адресную строку браузера?
Как добавить фоновый рисунок на веб-страницу?
Как сделать обтекание картинки текстом?
Как растянуть фон на всю ширину окна?
Как выровнять фотографию по центру веб-страницы?
Как разместить элементы списка горизонтально?
Как убрать подчеркивание у ссылок?
Как убрать маркеры в маркированном списке?
Как изменить расстояние между строками текста?
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
Как открыть ссылку в новом окне?
Популярные задачи
- TEX
- Отступы между блоков
- Андроид в тени
- Ссылка как кнопка
- Вложенные списки
- Форма регистрации
- Объединение ячеек таблицы
- Обязательные поля формы
- Цвет и фон в таблице
- Асуанская плотина
- Батарейка
- Заголовки