HTML справочник

HTML и XHTML теги

XHTML справочник | HTML и XHTML теги

Некоторые HTML теги, представленные внизу, устарели

Смотрите современные HTML теги пятой версии.

Предисловие

Вы находитесь на странице, с которой, можно сказать, все начиналось. Это одна из тех первых пяти-семи страниц, которые летом 2009 года я осмелился назвать сайтом, а чуть позже разместил на платном хостинге. Некоторые HTML теги, представленные здесь являются наследием более ранних версий Гипертекстового языка разметки документов HTML и уже не используются, поэтому приглашаю вас посмотреть свежие теги HTML 5, а это место пусть останется символом того, что всегда с чего-то нужно начинать.

A

Tег    <a> </a>     –    используется для создания ссылок.

Атрибуты:     href     –    указывает адрес ресурса (url);

<a href="mailto:your@email"> </a>    –    гиперссылка для отправки письма;

title     –    всплывающая подсказка;

target     –    способ открытия документа; значения: "_self" - по умолчанию и "_blank" - открывает в новом окне.

Пример:    <a href="http://ab-w.ru" target="_blank"> </a>

Тег    <abbr> </abbr>    –    используется для аббревиатуры.

Тег    <acronym> </acronym>    –    текст между тегов подчеркнут пунктирной линией.

Атрибуты:     title     –    всплывающая подсказка.

Тег    <address> </address>    –    отображает текст курсивом.

В

Тег    <b> </b>    –    устаревший тег для жирного текста, почти не используется.

Тег    <big> </big>    –    применяется для более крупного по размеру текста.

Тег    <blockquote> </blockquote>    –    для цитат, обеспечивает харрактерные отступы.

Тег    <body> </body>    –    внутри этого тега располагается вся видимая часть документа.

Атрибуты:    bgcolor    –    определяет цвет фона документа;

background    –    определяет фон, им может быть любое изображение;

text    –    устанавливает цвет текста содержимого HTML документа;

link, alink, vlink    –    цвет гиперссылок: обычной, при нажатии и на которой уже побывали.

Пример:    <body bgcolor="yellow" text="green" link="red" alink="blue">

Тег    <br />    –    непарный, используется для переноса строки.

Тег    <button> </button>    –    этот тег создает кнопку со встроенным изображением.

C

Тег    <caption> </caption>    –    предназначен для создания заголовка к таблице и может размещаться только внутри контейнера <table> </table>, причем сразу после открывающего тега; такой заголовок представляет собой текст, по умолчанию отображаемый перед таблицей и описывающий ее содержание.

Атрибуты:     align     –    выравнивание по горизонтали.

Пример:    <table> <caption> Текст </caption> ... </table>

Тег    <center> </center>    –    устаревший тег для центрирования, почти не используется.

Тег    <cite> </cite>    –    для цитат, коментариев; текст внутри него курсивный.

Атрибуты:    title     –    всплывающая подсказка.

Тег    <code> </code>    –    используется для написания програмного кода; моноширинный.

Атрибуты:    title     –    всплывающая подсказка.

D

Тег    <dd> </dd>    –    тег описания списка определений, шрифт внутри него жирный.

Пример:    <dl title="Это список определений">
                <dt>Какое-то определение</dt>
                      <dd>Описание этого определения</dd>
        </dl>

Тег    <del> </del>    –    выдает зачеркнутый текст; рекомендуется использовать именно его вместо тега <s> </s>.

Тег    <dfn> </dfn>    –    отмечает текст курсивом, как определение.

Атрибуты:    title     –    всплывающая подсказка.

Тег    <div> </div>    –    контейнер для содержимого; может содержать внутри себя другие <div> </div>; создает блок; ему можно назначить любое форматирование с помощью CSS.

Тег    <dl> </dl>    –    создает список определений.

Атрибуты:    title     –    всплывающая подсказка.

Пример:    <dl title="Это список определений">
                <dt>Какое-то определение</dt>
                      <dd>Описание этого определения</dd>
        </dl>

Тег    <dt> </dt>    –    это определение списка определений.

Пример:    <dl title="Это список определений">
                <dt>Какое-то определение</dt>
                      <dd>Описание этого определения</dd>
        </dl>

Е

Тег    <em> </em>    –    используется для обозначения текста курсивом.

F

Тег    <font> </font>    –     определяет свойства выводимого шрифта.

Атрибуты:    size     –    определяет размер шрифта от 1 до 7, по умолчанию - 3;

color     –    определяет цвет выводимого текста в режиме RGB.

Пример:    <font size="3" color="blue"> </font>

Тег    <form> </form>    –    основа формы, которая предоставляет пользователю возможность ввода и выбора данных и другой информации.

Атрибуты:    action     –    содержит адрес страницы с серверным сценарием;

method     –    метод передачи данных; возможные значения: "get" или "post";

name     –    имя, идентификатор формы.

Пример:    <form name="имя формы" method="post" action="адрес страницы обработчика">
                      Логин: <input type="text" name="произвольное имя">
           Пароль: <input type="password" name="произвольное имя">
                                  <input type="submit" value="войти">
                </form>

H

Tег    <h1> </h1>    –    создает заголовок; имет значения от 1 до 6.

Атрибуты:    align    –    выравнивание заголовка со значениями "left", "right" и "center".

Пример:    <h2 align="left"> </h2>    –    "left" по умолчанию, его можно не указывать.

Tег    <head> </head>    –    содержит индексирующую информацию о документе.

Tег    <hr />    –    непарный; добавляет горизонтальную линию с отступами по вертикали.

Атрибуты:    size    –    задает толщину линии;

width    –    определяет ширину линии в пикселях или процентах;

noshade    –    указывает на то, что линия не имеет тени;

color    –    задает линии определенный цвет.

Пример:    <hr size="3" color="#555555" />

Тег    <html> </html>    –    указывает , что это HTML документ.

I

Tег    <i> </i>    –    преобразует текст в курсивный, почти не используется.

Tег    <iframe> </iframe>    –    плавающий фрейм; является блочным элементом и может располагаться в любой части страницы.

Атрибуты:    name    –    задает имя элементу;

src    –    указывает адрес выводимого документа;

width    –    указывает ширину в пикселях или процентах;

height    –    указывает высоту в пикселях или процентах;

frameborder    –    при значении "0" или "no", рамка не отображается;

scrolling    –    прокрутка; значения: "yes", "auto", при значении "no", полоса прокрутки отсутствует;

align    –    выравнивание; значения: "left", "right".

Пример:    <iframe name="имя" src="адрес документа" width="300" height="500" frameborder="no" scrolling="no"> </iframe>

Tег    <img />    –    непарный; помещает изображения GIF, JPEG, JPG, PNG в документ.

Атрибуты:    src    –    обязательный атрибут, указывает URL адрес изображения;

align    –    атрибут выравнивания со значениями "left", "right", "top", "bottom", "center", "middle";

alt    –    всплывающий текстовый коментарий к изображению;

border    –    задает рамку вокруг изображения, по умолчанию border="0";

ismap    –    сообщает о том, что изображение является картой-изображением на сервере;

hspace    –    задает отступы в пикселях по-горизонтали слева и справа от изображения;

vspace    –    отступы в пикселях по-вертикали сверху и снизу от изображения;

usemap    –    сообщает, что изображение является картой-изображением на стороне клиента;

height    –    высота изображения в пикселях или процентах;

width    –    ширина изображения в пикселях или процентах.

Пример:    <img src="xxx.jpg" alt="текст описания">

Tег    <input>    –    элемент формы; создает поля и переключатели.

Атрибуты:    type    –    определяет тип содержимого при вводе; значения: "text", "password", "radio", "checkbox", "submit", "reset", "hidden", "image"(type="image" src="адрес изображения");

name    –    выполняет роль идентификатора для содержимого;

value    –    присваевает значение необходимое для идентификации и обработки вводимого содержимого.

Пример:    <form name="има формы" method="post" action="адрес страницы обработчика">
                      Логин: <input type="text" name="произвольное имя">
           Пароль: <input type="password" name="произвольное имя">
           <input type="submit" value="войти">
        </form>

Tег    <ins> </ins>    –    выводит подчеркнутый текст.

K

Tег    <kbd> </kbd>    –    текст внутри этого тега моноширинный.

L

Tег    <li> </li>    –    определяет строку для списка.

Пример:    <ol type="1" title="нумерованный список">
                <li>Строка списка</li>
                      <li> Строка списка</li>
        </ol>

Tег    <link />    –    определяет ссылку; используется внутри контейнера <head> </head>.

Пример:    <link rel="stylesheet" href="default.css" type="text/css" />

M

Tег    <marquee> </marquee>    –    задает тексту движение в зависимости от значений.

Атрибуты:    behavior    –    определяет тип движения текста; (значения: "alternate" - движение слева направо, "scroll" - достигнув края, текст появляется с противоположной стороны экрана, "slide" - текст останавливается у противоположного края экрана);

direction    –    определяет направление движения текста; (значения: "down" - вниз, "up" - движение вверх, "left" - движение справа налево, "right" - движение слева направо).

Пример:    <marquee behavior="alternate" direction="right"> </marquee>

Tег    <meta />    –    одиночный; используется для идентификации и индексации документов поисковыми машинами; помещается между тегов <head> </head>.

Пример:    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">    –    эти параметры обеспечивают правильное отображение содержимого и языка документа;

<meta name="description" content="здесь должно быть описание">    –     краткое описание вашего сайта для поисковых систем;

<meta name="keywords" content="здесь должно быть описание">    –    ключевые слова - основной элемент при индексировании поисковыми машинами вашего сайта.

N

Tег    <nobr> </nobr>    –    запрещает перенос строки, строка сохраняет свою целостность.

O

Tег    <ol> </ol>    –    создает нумерованный список.

Атрибуты:     type    –    определяет тип маркера со значениями: "A" - заглавные буквы, "a" - строчные буквы, "I" - заглавные римские цифры, "i" - строчные римские цифры, "1" - арабские цифры;

start     –    стартовое значение при использовании арабских цифр;

title     –    всплывающая подсказка.

Пример:    <ol type="A" title="нумерованный список">
               <li>Строка списка</li>
                      <li>Строка списка</li>
        </ol>

Tег    <option> </option>    –     обязательный элемент тега <select> </select>.

Атрибуты:     selected    –    индикатор выбранной по умолчанию строки.

Пример:    <select size="3">
                <option>Строка списка</option>
                      <option>Строка списка</option>
                      <option>Строка списка</option>
                <option selected>Строка списка</option>
        </select>

P

Tег    <p> </p>    –    создает параграф; внутри себя не может содержать другие параграфы.

Атрибуты:     align    –    выравнивание по горизонтали; значения: "left", "right", "justify", "center";

title    –    всплывающая подсказка.

Пример:    <p align="center"> </p>

Tег    <pre> </pre>    –    текст моноширинный; сохраняет исходное количество пробелов.

S

Tег    <s> </s>    –    выводит зачеркнутый по-горизонтали текст.

Tег    <samp> </samp>    –    выводит текст, моноширинным шрифтом.

Tег    <select> </select>    –    выводит обычный или выпадающий список в рамках формы.

Атрибуты:     size    –    если имеет значение больше "1" - список с прокруткой, если равное "1" или не указано - выводится одна строка и список будет выпадающим.

Пример:    <select size="3">
                <option>Строка списка</option>
                      <option>Строка списка</option>
                      <option>Строка списка</option>
                <option selected>Строка списка</option>
        </select>

Tег    <small> </small>    –    выводит более мелкий текст.

Tег    <span> </span>    –    является контейнером для отрезка текста; внутри абзаца или блока может быть произвольное количество отрезков.

Tег    <strong> </strong>    –    используется для выведения жирного шрифта.

Tег    <sub> </sub>    –    отображает выводимый текст в нижнем регистре: H2SO4.

Tег    <sup> </sup>    –    отображает текст в верхнем регистре: TM.

T

Tег    <table> </table>    –    создает таблицу; можно вкладывать таблицу в ячейку другой таблицы, что часто применяется на практике.

Атрибуты:     align    –    выравнивание относительно страницы; значения: "left", "right" и "center";

background    –    определяет каким будет задний фон; фоном может быть изображение;

bgcolor    –    определяет цвет заднего фона таблицы;

border    –    рамка; есле значение равно "1" или атрибут не указан - рамка не отображается;

bordercolor    –    определяет цвет рамки;

cellspacing    –    задает пространство между ячейками таблицы;

cellpadding    –    задает пространство между содержимым ячейки и ее рамкой;

width    –    задает ширину таблицы в процентах или пикселях.

Пример:    <table width="300" border="1" bordercolor="red">
                <tr>
                      <th>Заголовок столбца</th>
                      <td>Содержимое ячейки</td>
                </tr>
                <tr>
                      <th>Заголовок столбца</th>
                      <td>Содержимое ячейки</td>
                </tr>
              </table>

Tег    <tbody> </tbody>    –    предназначен для хранения одной или нескольких строк таблицы, это позволяет создавать структурные блоки, к которым можно применять единое оформление через стили, а также управлять их видом через скрипты; можно использовать несколько таких тегов в пределах одной таблице.

Атрибуты:     align    –    выравнивание содержимого по горизонтали; значения: "left", "right" и "center";

valign    –    выравнивание содержимого по вертикали; значения: "top", "bottom", "middle" и "baseline";

bgcolor    –    определяет цвет фона ячеек.

Пример:    <table> <thead> <tr> <td> ... </td> </tr> </thead> <tbody> ... </tbody> </table>

Tег    <td> </td>    –    элемент таблицы; создает ячейку.

Атрибуты:     align    –    выравнивание содержимого по горизонтали; значения: "left", "right" и "center";

valign    –    выравнивание содержимого по вертикали; значения: "top", "bottom" и "middle";

height    –    определяет высоту ячейки или строки в процентах или пикселях;

colspan    –    определяет количество столбцов объединенных в одной ячейке таблицы;

rowspan    –    определяет количество строк объединенных в одной ячейке таблицы;

title    –    всплывающая подсказка.

Tег    <textarea> </textarea>    –    элемент формы; создает многострочное поле ввода.

Атрибуты:     name    –    присваевает имя элементу;

rows    –    задает количество строк текста;

cols    –    задает количество колонок шириной в одну букву.

Пример:    <form name="имя формы" method="post" action="адрес страницы обработчика">
                  <textarea name="произвольное имя" rows="30" cols="50">
                  </textarea>
                     <input type="submit" value="отправить">
           </form>

Tег    <th> </th>    –    создает заголовочную ячейку таблицы; текст внутри обычно жирный и выровнен по центру.

Атрибуты:     align    –    выравнивание содержимого по горизонтали;

valign    –    выравнивание содержимого по вертикали;

bgcolor    –    определяет цвет фона ячеек;

background    –    определяет фоновый рисунок ячейки;

bordercolor    –    определяет цвет рамки;

colspan    –    объеденяет горизонтальные ячейки;

height    –    задает высоту ячейки;

nowrap    –    запрещает перенос строки;

rowspan    –    объеденяет вертикальные ячейки;

width    –    задает ширину ячейки.

Пример:    <table> <tr> <th>...</th> </tr> </table>

Tег    <thead> </thead>    –    заголовок таблицы; разрешается применять один раз в пределах одной таблицы.

Атрибуты:     align    –    выравнивание содержимого по горизонтали;

valign    –    выравнивание содержимого по вертикали;

bgcolor    –    определяет цвет фона ячеек.

Пример:    <table> <thead> <tr> <td> ... </td> </tr> </thead> <tbody> ... </tbody> </table>

Tег    <title> </title>    –    его содержимое определяет название страницы в браузере; его место между тегами <head> </head>.

Tег    <tr> </tr>    –    элемент таблицы; создает строку внутри таблицы.

Атрибуты:     align    –    выравнивание содержимого по горизонтали; значения: "left", "right" и "center";

valign    –    выравнивание содержимого по вертикали; значения: "top", "bottom" и "middle".

Tег    <tt> </tt>    –    задает моноширинный стиль текста.

U

Tег    <u> </u>    –    выводит подчеркнутый текст в документ.

Tег    <ul> </ul>    –    определяющий элемент ненумерованного списка.

Атрибуты:     type    –    указывает тип символа перед строкой; значения: "disk", "circle" и "square";

title    –    всплывающая подсказка.

Пример:    <ul type="square" title="ненумерованный список">
               <li>Строка списка</li>
                      <li>Строка списка</li>
        </ul>

Смотрите дополнительно новые HTML 5 теги

Автор проекта - Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018

HTML справочник | XHTML   HTML и XHTML теги   HTML и XHTML мета-теги