Изучаем HTML. Часть 3 — Атрибуты тегов

**Admin** Пн Ноя 01, 2010 10:18 pm

Настало время рассказать всю правду о html тегах.

До этого, описывая теги, я не договаривал. Дело в том, что почти у каждого тега есть атрибуты.

Атрибут — это дополнительная настройка тега. Атрибуты вписываются внутри тега после имени, но до закрывающей скобки >.

В итоге html тег в общем случае выглядит так:

Код HTML:
<тег атрибут1="значение1" атрибут2="значение2" … /> — одиночный тег
<тег атрибут1="значение1" атрибут2="значение2" …> содержание </тег> — контейнерный тегПрежде чем переходить к конкретным атрибутам, надо сказать, что у каждого атрибута есть значение по-умолчанию. Значение по-умолчанию атрибута тега применяется как параметр для тега, если атрибут не указан.

Для разных атрибутов у разных тегов определены разные значения по-умолчанию. Но в любом случае значения по-умолчанию для тегов определены так, чтобы теги «вели себя» самым ожидаемым образом.

Следует отметить, что для разных браузеров эти значения по-умолчанию могут быть определены по разному.

Для контейнерных тегов, когда блоки начинают вкладываться друг в друга, то значения по-умолчанию для внутренних тегов чаще всего берутся из внешних (Опять же, бывают исключения в некоторых браузерах). Проще всего понять это на примере.

Почти у всех тегов — блоков текста (<P>, <H1…6>, <DIV> и другие) есть параметр align — выравнивание. Он может принимать 3 значения: left, center, right. Лево, по центру и справа, соответственно. Значением по-умолчанию является left. Есть еще четвертый вариант — justify — выравнивание сразу и по левому и по правому краю. Но он поддерживается не всеми браузерами.
Давайте посмотрим, как он работает. Соорудим такой html документ:

Код HTML:
<HTML>
<HEAD>
<title>Изучаем html</title>
</HEAD>

<BODY>
<div align="center">
Первый внешний абзац
<div>Первый внутренний абзац</div>
<div align="left">Второй внутренний абзац</div>
</div>

<div align="right">
Второй внешний абзац
<div align="center">Третий внутренний абзац</div>
<div>Четвертый внутренний абзац</div>
</div>

</BODY>
</HTML>Вот что получится: Посмотреть пример.

Как Вы видите, в документе определены 2 блока помощью тегов div, в которых есть просто текст и по 2 внутренних блока, определенные тоже тегами div.

Первый большой абзац выровнен по центру, а второй — по правому краю. Все, что помещается внутрь этих тегов выравнивается соответственно (смотрите первый и четвертый внутренние абзацы). Но для второго и третьего внутренних абзацев определено свое выравнивание. Оно и применяется.

Итак, мы уже познакомились с одним атрибутом. Но давайте будем идти по тегам, а не по атрибутам:

Атрибуты тега <P>:
ALIGN — определяет способ горизонтального выравнивания параграфа.
Возможные значения: left, center, right. По умолчанию имеет значение left.

Атрибуты тега <BR>:
CLEAR — указывает на необходимость завершения обтекания изображения текстом. Используется только рядом с картинками, для которых установлено обтекание текста. Может принимать следующие значения:
all — завершить обтекание изображения текстом.
left — завершить обтекание текстом изображения, выровненного по левому краю.
right — завершить обтекание текстом изображения, выровненного по правому краю.
Атрибуты тегов <H1>, <H2> … <H6>:
ALIGN — определяет способ горизонтального выравнивания параграфа.
Возможные значения: left, center, right. По умолчанию имеет значение left.

Атрибуты тега <HR>:
WIDTH — определяет длину линии в пикселах или процентах от ширины окна браузера.
SIZE — определяет толщину линии в пикселах.
ALIGN — определяет выравнивание горизонтальной линии. Атрибут может принимать следующие значения:
left — выравнивание по левому краю документа.
right — выравнивание по правому краю документа.
center — выравнивание по центру документа (используется по умолчанию).
NOSHADE — определяет способ закраски линии как сплошной. Атрибут является флагом и не требует указания значения. Без данного атрибута линия отображается объемной.
COLOR — определяет цвет линии. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов. Атрибут работает только в Internet Explorer.

На этом с атрибутами уже изученных тегов разобрались. В дальнейшем все теги буду описывать уже со всеми атрибутами.

Как раз есть время изучить еще один полезный тег:
<DIV>…</DIV> — блок текста. Используется для логического выделения блока HTML документа. В простом режиме обычно используется для выравнивания блока в окне браузера.
В современном сайтостроении используется как удобный контейнер для объектов страницы, которым легко динамически управлять — перемещать, включать/выключать, создавать слои, регулировать отступы и т. п. Все эти приемы мы изучим в следующих уроках.
Находящиеся между начальным и конечным тегами текст или HTML элементы по-умолчанию оформляются как отдельный параграф.
Атрибуты тега <DIV>:
ALIGN — определяет выравнивание содержимого элемента DIV. Атрибут может принимать значения: left, right, center.

Жду Ваших экспериментов с тегами и атрибутами. Выкладывайте, не стесняемся.