HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.
Язык HTML является приложением SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879.
Язык XHTML является более строгим вариантом HTML, он следует всем ограничениям XML и, фактически, XHTML можно воспринимать как приложение языка XML к области разметки гипертекста.
Во всемирной паутине HTML-страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS, в виде простого текста или с использованием шифрования.
| Основные теги | |
| <;html>;<;/html>; | Указывает программе просмотра страниц что это HTML документ. |
| <;head>;<;/head>; | Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин. |
| <;body>;<;/body>; | Определяет видимую часть документа |
| Теги оглавления | |
| <;title>;<;/title>; | Помещает название документа в оглавление программы просмотра страниц |
| Атрибуты тела документа | |
| <;body bgcolor=?>; | Устанавливает цвет фона документа, используя значение цвета в виде RRGGBB – пример: FF0000 – красный цвет. |
| <;body text=?>; | Устанавливает цвет текста документа, используя значение цвета в виде RRGGBB – пример: 000000 – черный цвет. |
| <;body link=?>; | Устанавливает цвет гиперссылок, используя значение цвета в виде RRGGBB – пример: 00FF00 – зеленый цвет. |
| <;body vlink=?>; | Устанавливает цвет гиперссылок на котох вы уже побывали, используя значение цвета в виде RRGGBB – пример: 333333 – серый цвет. |
| <;body alink=?>; | Устанавливает цвет гиперссылок при нажатии. |
| Теги для форматирования текста | |
| <;pre>;<;/pre>; | Обрамляет предварительно отформатированный текст. |
| <;h1>;<;/h1>; | Создает САМЫЙ БОЛЬШОЙ заголовок |
| <;h5>;<;/h5>; | Создает самый маленький заголовок |
| <;b>;<;/b>; | Создает жирый текст |
| <;i>;<;/i>; | Создает наклонный текст |
| <;tt>;<;/tt>; | Создает текст – имитирующий стиль печатной машинки. |
| <;cite>;<;/cite>; | Используется для цитат, обычно наклонный текст. |
| <;em>;<;/em>; | Используется для выделения из текста слова (наклонный или жирный текст) |
| <;font size=?>;<;/font>; | Устанавливает размер текста в пределах от 1 до 7. |
| <;font color=?>;<;/font>; | Устанавливает цвет текста, используя значение цвета в виде RRGGBB. |
| Гиперссылки | |
| <;a href="URL">;<;/a>; | Создает гиперссылку на другие документы или часть текущего документа. |
| <;a href="mailto:EMAIL">; <;/a>; |
Создает гиперссылку вызова почтовой программы для написания письма по указанному адресу. |
| <;a name="NAME">;<;/a>; | Отмечает часть текста как цель для гипперссылок в документе. |
| <;a href="#NAME">;<;/a>; | Создает гиперссылку на часть текущего документа. |
| Форматирование | |
| <;p>; | Создает новый параграф |
| <;p align=?>; | Выравнивает параграф относительно одной из сторон документа, значения: left, right, justify или center |
| <;br>; | Вставляет перевод строки. |
| <;blockquote>; <;/blockquote>; |
Создает отступы с обеих сторон текста. |
| <;dl>;<;/dl>; | Создает список определений. |
| <;dt>; | Определяет каждый из терминов списка |
| <;dd>; | Описывает каждое определение |
| <;ol>;<;/ol>; | Создает нумерованный список |
| <;li>; | Определяет каждый элемент списка и присваивает номер |
| <;ul>;<;/ul>; | Создает ненумерованный список |
| <;li>; | Предваряет каждый элемент списка и добавляет кружок или квадратик. |
| <;div align=?>; | Важный тег используемый для форматирования больших блоков текста HTML документа, также используется в таблицах стилей |
| Графические элементы | |
| <;img src="name">; | Добавляет изображение в HTML документ |
| <;img src="name" align=?>; | Выравнивает изображение к одной из сторон документа, принимает значения: left, right, center; bottom, top, middle |
| <;img src="name" border=?>; | Устанавливает толщину рамки вокруг изображения |
| <;hr>; | Добавляет в HTML документ горизонтальную линию. |
| <;hr size=?>; | Устанавливает высоту(толщину) линии |
| <;hr width=?>; | Устанавливает ширину линии, можно указать ширину в пикселах или процентах. |
| <;hr noshade>; | Создает линию без тени. |
| <;hr color=?>; | Задает линии определенный цвет. Значение RRGGBB. |
| Таблицы | |
| <;table><;/table> | Создает таблицу. |
| <;tr><;/tr> | Определяет строку в таблице. |
| <;td><;/td> | Определяет отдельную ячейку в таблице. |
| <;th><;/th> | Определяет заголовок таблицы (нормальная ячейка с отцентрованным жирным текстом) |
| Атрибуты таблицы | |
| <;table border=#>; | Задает толщину рамки таблицы. |
| <;table cellspacing=#>; | Задает расстояние между ячейками таблицы. |
| <;table cellpadding=#>; | Задает расстояние между содержимым ячейки и ее рамкой. |
| <;table width=#>; | Устанавливает ширину таблицы в пикселах или процентах от ширины документа. |
| <;tr align=?>; или <;td align=?>; | Устанавливает выравнивание ячеек в таблице, принимает значения: left, center, или right. |
| <;tr valign=?>; или <;td valign=?>; | Устанавливает вертикальное выравнивание для ячеек таблицы, принимает значения : top, middle, или bottom. |
| <;td colspan=#>; | Указывает кол-во столбцев которое объединено в одной ячейке. (по умолчанию=1) |
| <;td rowspan=#>; | Указывает кол-во строк которое объединено в одной ячейке. (по умолчанию=1) |
| <;td nowrap>; | Не позволяет программе просмотра делать перевод строки в ячейке таблицы. |
| Фреймы | |
| <;frameset>;<;/frameset>; | Предваряет тег <;body>; в документе, содержащем фреймы; |
| <;frameset rows="value,value">; | Определяет строки в таблице фреймов, высота которых определена кол-вом пикселов или в процентном соотношении к высоте таблицы фреймов. |
| <;frameset cols="value,value">; | Определяет столбцы в таблице фреймов, ширина которых определена кол-вом пикселов или в процентном соотношении к ширине таблицы фреймов. |
| <;frame>; | Определяет единичный фрейм или область в таблице фреймов. |
| <;noframes>;<;/noframes>; | Определяет, что будет показано в окне браузера если он не поддерживает фреймы. |
| Атрибуты фреймов | |
| <;frame src="URL">; | Определяет какой из HTML документов будет показан во фрейме. |
| <;frame name="name">; | Указывает Имя фрейма или области, что позволяет перенаправлять информацию в этот фреймр или область из других фреймов. |
| <;frame marginwidth=#>; | Определяет величину отступов по левому и правому краям фрема; должно быть равно или больше 1. |
| <;frame marginheight=#>; | Определяет величину отступов по верхнему и нижнему краям фрейма; должно быть равно или больше 1. |
| <;frame scrolling=VALUE>; | Указывает будет-ли выводится линейка прокрутки во фрейме; значение value может быть “yes,” “no,” или “auto”. Значение по умолчанию для обычных документов – auto. |
| <;frame noresize>; | Препятствует изменению размеров фрейма. |
| Формы | |
| Для форм, выполняющих какие-то функции должны быть запущены соответствующие CGI скрипты на сервере. HTML только создает внешний интерфейс формы. | |
| <;form>;<;/form>; | Создает формы |
| <;select multiple name="NAME" size=?>;<;/select>; | Создает скролируемое меню. Size устанавливает кол-во пунктов меню, которое будет показано на экране, остальные будут доступны при использовании прокрутки. |
| <;option>; | Указывает каждый отдельный элемент меню |
| <;select name="NAME">;<;/select>; | Создает ниспадающее меню |
| <;option>; | Указывает каждый отдельный элемент меню |
| <;textarea name="NAME" cols=40 rows=8>;<;/textarea>; | Создает окно для ввода текста. Columns указывает ширину окна; rows указывает его высоту. |
| <;input type="checkbox" name="NAME">; | Создает checkbox. За тегом следует текст. |
| <;input type="radio" name="NAME" value="x">; | Создает radio кнопку. За тегом следует текст. |
| <;input type=text name="foo" size=20>; | Создает строку для ввода текста. Параметром Size указывается длина в символах. |
| <;input type="submit" value="NAME">; | Создает кнопку “Принять” |
| <;input type="image" border=0 name="NAME" src="name.gif">; | Создает кнопку “Принять” – для этого используется изображение |
| <;input type="reset">; | Создает кнопку “Отмена” |