HTML шпаргалка

Справочник HTML тегов и атрибутов

Основные теги

Тег	Описание	Пример
<h1>-<h6>	Заголовки	<h1>Заголовок</h1>
<p>	Параграф	<p>Текст</p>
<a>	Ссылка	<a href="#">Ссылка</a>
<img>	Изображение	<img src="img.jpg" alt="">
<div>	Блочный контейнер	<div>Контент</div>
<span>	Строчный контейнер	<span>Текст</span>

Списки

Тег	Описание	Пример
<ul>	Маркированный список	<ul><li>Пункт</li></ul>
<ol>	Нумерованный список	<ol><li>Пункт</li></ol>
<li>	Элемент списка	<li>Элемент</li>

Формы

Тег	Описание	Пример
<form>	Форма	<form action="#"></form>
<input>	Поле ввода	<input type="text">
<button>	Кнопка	<button>Кнопка</button>
<textarea>	Многострочное поле	<textarea></textarea>
<select>	Выпадающий список	<select><option>Вариант</option></select>

Таблицы

Тег	Описание	Пример
<table>	Таблица	<table></table>
<tr>	Строка	<tr></tr>
<td>	Ячейка	<td>Данные</td>
<th>	Заголовок	<th>Заголовок</th>
<thead>	Шапка таблицы	<thead></thead>
<tbody>	Тело таблицы	<tbody></tbody>
<tfoot>	Подвал таблицы	<tfoot></tfoot>

Семантические теги

Тег	Описание	Пример
<header>	Шапка страницы	<header></header>
<nav>	Навигация	<nav></nav>
<main>	Основной контент	<main></main>
<article>	Статья	<article></article>
<section>	Секция	<section></section>
<aside>	Боковая панель	<aside></aside>
<footer>	Подвал	<footer></footer>

Медиа и встроенный контент

Тег	Описание	Пример
<img>	Изображение	<img src="img.jpg" alt="">
<video>	Видео	<video src="video.mp4"></video>
<audio>	Аудио	<audio src="audio.mp3"></audio>
<iframe>	Встроенный фрейм	<iframe src="url"></iframe>
<canvas>	Холст для графики	<canvas></canvas>
<svg>	SVG графика	<svg></svg>

Метаданные и скрипты

Тег	Описание	Пример
<meta>	Метаданные	<meta charset="UTF-8">
<link>	Связь (CSS, иконка)	<link rel="stylesheet" href="style.css">
<script>	JavaScript	<script src="app.js"></script>
<style>	CSS стили	<style>...</style>
<title>	Заголовок страницы	<title>Заголовок</title>