HTML елементи. Довідник



HTML теги впорядковані за категорією

= Нові в HTML5.


Базовий HTML

Тег Опис
<!DOCTYPE>  Визначає тип документу
<html> Визначає документ HTML
<head> Визначає інформацію про документ
<title> Визначає заголовок документа
<body> Визначає тіло документа
<h1> to <h6> Визначає заголовки HTML
<p> Визначає параграф (абзац)
<br> Вставляє один розрив рядка
<hr> Визначає тематичну зміну вмісту
<!--...--> Визначає коментар

Форматування

Тег Опис
<acronym> Не підтримується в HTML5. Використовуйте <abbr> замість цього.
Визначає акронім
<abbr> Визначає абревіатуру або акронім
<address> Визначає контактну інформацію для автора / власника документа / статті
<b> Визначає жирний текст
<bdi> Ізолює частину тексту, який може бути відформатований в іншому напрямку від іншого тексту за його межами
<bdo> Перевизначає поточний напрямок тексту
<big> Не підтримується в HTML5. Використовуйте CSS замість цього.
Визначає великий текст
<blockquote> Визначає розділ, що цитується з іншого джерела
<center> Не підтримується в HTML5. Використовуйте CSS замість цього.
Визначає центрування тексту
<cite> Визначає назву твору
<code> Визначає фрагмент комп'ютерного коду
<del> Визначає видалений з документа текст
<dfn> Представляє визначальний екземпляр терміна
<em> Визначає підкреслений текст
<font> Не підтримується в HTML5. Використовуйте CSS замість цього.
Визначає шрифт, колір і розмір для тексту
<i> Визначає частину тексту альтернативним голосом або настроєм
<ins> Визначає текст, який було вставлено в документ
<kbd> Визначає введення з клавіатури
<mark> Визначає позначений / виділений текст
<meter> Визначає скалярне вимірювання в межах відомого діапазону (датчик)
<pre> Визначає попередньо відформатований текст
<progress> Представляє хід виконання завдання
<q> Визначає коротку цитату
<rp> Визначає, що показувати в браузерах, які не підтримують ruby анотації
<rt> Визначає пояснення / вимову символів (для східноазіатського типографіки)
<ruby> Визначає анотацію ruby (для східноазіатської типографіки)
<s> Визначає текст, який більше не є правильним
<samp> Визначає вихідні дані з комп'ютерної програми
<small> Визначає менший текст
<strike> Не підтримується в HTML5. Використовуйте <del> або <s> замість цього.
Визначає перекреслений текст
<strong> Визначає важливий текст
<sub> Визначає підрядковий текст (нижній індекс)
<sup> Визначає надрядковий текст (верхній індекс)
<template> Визначає шаблон
<time> Визначає дату / час
<tt> Не підтримується в HTML5. Використовуйте CSS замість цього.
Визначає текст телетайпу
<u> Визначає текст, який має бути стилістично відмінним від звичайного тексту
<var> Визначає змінну
<wbr> Визначає можливий розрив рядка

Форми та вхідні дані

Тег Опис
<form> Визначає форму HTML для введення користувача
<input> Визначає елемент управління введенням
<textarea> Визначає багаторядковий елемент управління введенням (текстова область)
<button> Визначає кнопку, що можна натискати
<select> Визначає випадаючий список
<optgroup> Визначає групу відповідних параметрів у випадаючому списку
<option> Визначає параметр у випадаючому списку
<label> Визначає мітку для <input> елемента
<fieldset> Групи пов'язаних елементів у формі
<legend> Визначає заголовок для <fieldset> елемента
<datalist> Визначає список попередньо визначених параметрів керування введенням
<output> Визначає результат розрахунку

Фрейми

Тег Опис
<frame> Не підтримується в HTML5.
Визначає вікно (фрейм) в наборі фреймів
<frameset> Не підтримується в HTML5.
Визначає набір фреймів
<noframes> Не підтримується в HTML5.
Визначає альтернативний вміст для користувачів, які не підтримують фрейми
<iframe> Визначає вбудований фрейм

Зображення

Тег Зображення
<img> Визначає зображення
<map> Визначає карту зображення на стороні клієнта
<area> Визначає область всередині карти зображення
<canvas> Використовується для малювання на льоту, за допомогою сценаріїв (зазвичай JavaScript)
<figcaption> Визначає заголовок для елемента <figure>
<figure> Визначає автономний вміст
<picture> Визначає контейнер для декількох ресурсів зображення
<svg> Визначає контейнер для графіки SVG

Аудіо / Відео

Тег Опис
<audio> Визначає звуковий контент
<source> Визначає кілька медіа-ресурсів для медіа-елементів (<video>, <audio>, <picture>)
<track> Визначає текстові доріжки для медіа-елементів (<video> та <audio>)
<video> Визначає відео чи фільм

Посилання

Тег Опис
<a> Визначає гіперпосилання
<link> Визначає взаємозв'язок між документом і зовнішнім ресурсом (найчастіше використовується для посилання на зовнішні таблиці стилів)
<nav> Визначає навігаційні посилання (навігація по сайту)

Списки

Тег Опис
<ul> Визначає невпорядкований (ненумерований) список
<ol> Визначає впорядкований (нумерований) список
<li> Визначає елемент списку
<dir> Не підтримується в HTML5. Використовуйте <ul> замість цього.
Визначає список каталогів
<dl> Визначає список описів
<dt> Визначає термін / ім'я в списку опису
<dd> Визначає опис / значення терміна в списку опису

Таблиці

Tег Опис
<table> Визначає таблицю
<caption> Визначає підпис таблиці
<th> Визначає чарунку заголовка в таблиці
<tr> Визначає рядок у таблиці
<td> Визначає клітинку (чарунку) в таблиці
<thead> Групує вміст заголовка в таблиці
<tbody> Групує вміст тіла в таблиці
<tfoot> Згруповує вміст нижнього колонтитула в таблиці
<col> Вказує властивості стовпців для кожного стовпця в елементі <colgroup>
<colgroup> Визначає групу з одного або декількох стовпців у таблиці для форматування

Стилі і семантика

Тег Опис
<style> Визначає інформацію про стиль для документа
<div> Визначає розділ (блочний) у документі
<span> Визначає розділ (строчний) у документі
<header> Визначає заголовок для документа або розділу
<footer> Визначає нижній колонтитул (футер) для документа або розділу
<main> Визначає основний вміст документа
<section> Визначає розділ (секцію) у документі
<article> Визначає статтю
<aside> Визначає вміст, окрім вмісту сторінки (збоку)
<details> Визначає додаткові деталі, які користувач може переглядати або ховати
<dialog> Визначає діалоговий бокс або вікно
<summary> Визначає видимий заголовок для елемента <details>
<data> Пов'язує заданий контент з машиночитаним перекладом

Meta Info

Тег Опис
<head> Визначає інформацію про документ
<meta> Визначає метадані HTML документу
<base> Вказує базову URL-адресу / ціль для всіх відносних URL-адрес документа
<basefont> Не підтримується в HTML5. Використовуйте CSS замість цього.
Визначає колір, розмір і шрифт за замовчуванням для всього тексту документа

Програмування

Тег Опис
<script> Визначає скрипт на стороні клієнта
<noscript> Визначає альтернативний вміст для користувачів, які не підтримують сценарії на стороні клієнта
<applet> Не підтримується в HTML5. Використовуйте <embed> або <object> замість цього.
Визначає вбудований аплет
<embed> Визначає контейнер для зовнішнього (не HTML) додатка
<object> Визначає вбудований об'єкт
<param> Визначає параметр для об'єкта


warning

Не викладайте свій код безпосередньо в коментарях, він відображається некоректно. Скористайтесь такими сервісами, як jsfiddle.net, codepen.io, liveweave.com, jsbin.com, збережіть код на будь-якому з цих сервісів і в коментарях дайте на нього посилання. Так буде видно і код, і результат.