Теги форматирования текста

Некоторые теги форматирования текста мы уже знаем. На этой странице изучим оставшиеся.

Заголовки (H1 ... H6)

Заголовки определяются тегами <h1>, <h2> ... <h6>. Тег <h1> — заголовок первого уровня (самый большой шрифт), <h6> — заголовок шестого уровня - самого низкого в иерархии заголовков (самый маленький шрифт). Закрывающий тег обязателен.

Теги заголовков могут иметь атрибут align, определяющий способ горизонтального выравнивания. Возможные значения — left, center, right. По умолчанию — left.

Поэксперементируйте немного и вы поймете что к чему. Экспериментируйте - это лучший способ набраться опыта.

Тег DIV

Тег <div> предназначен для выделения фрагмента HTML-кода с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей.

Содержимое тега <div> всегда начинается с новой строки. После него также добавляется перенос строки.

Атрибуты: align. Значения: left, center, right, justify. По умолчанию — left. Закрывающий тег обязателен.

Пример:

Первые две строки заключены в тег DIV
и выровнены по правому краю.

А эта часть текста заключена в тег P.
Чтобы перенести строку, используй тег BR.

Код в этом случае будет выглядеть так:

<div align="right">Первые две строки заключены в тег DIV<br> и выровнены по правому краю.</div>
<p>А эта часть текста заключена в тег P.<br>Чтобы перенести строку, используй тег BR.</p>

Следует отметить, что тег <div> имеет превосходство над тегом <p>. Это означает, что тег <div> нельзя размещать внутри тега <p>. А наоборот, <p> внутри <div>, можно — все будет работать. Попробуйте сделать так и так, и вы поймете разницу.

Тег SPAN

Тег <span> предназначен для определения части элементов документа. Сам по себе тег смысловой нагрузки не несет и начинает работать если прописать какой нибудь стиль.

С помощью тега <span> можно выделить часть информации внутри других тегов и задать для нее свой стиль.

Пример кода:

<p>Внутри параграфа (тег P) можно изменить цвет и размер <span style="color:red">любых слов</span> или даже <strong><span style="color:green">б</span><span style="color:red">ук</span><span style="color:blue">в</span></strong>, если добавить начальный и конечный тег SPAN и определить для него стиль текста.</p>

В браузере мы увидим:

Внутри параграфа (тег P) можно изменить цвет и размер любых слов или даже букв, если добавить начальный и конечный тег SPAN и определить для него стиль текста.

Обычно тег <span> используется вместе с внешними таблицами стилей (CSS), но об этом будет написано в соответствующем разделе.

Тег FONT

Тег <font> определяет шрифт текста, его цвет и размер. Закрывающий тег обязателен.

Атрибуты:

face — задает гарнитуру шрифта. Используйте те, что попроще: Verdana, Times New Roman, Arial, Tahoma, Courier. Используя какие-нибудь экзотические шрифты, Вы рискуете, что пользователь его не увидит. При отсутствии на компьютере посетителя заданного шрифта, отображается шрифт, установленный в браузере по умолчанию.
size — задает размер шрифта в условных единицах от 1 до 7. Средний размер, используемый по умолчанию — 3.
color — задает цвет текста, используя либо RGB-значение в шестнадцатиричной системе, либо однин из 16 базовых цветов. RGB-значение можно подобрать здесь.

Пример кода:

Обычный текст.<br>
<font face="Times New Roman" size="+1" color="green">Шрифт Times New Roman, зеленого цвета, увеличенный на еденицу.</font><br>
<font color="red" face="Courier" size="3">Красный текст, шрифт Courier.</font>

Результат в браузере:

Обычный текст.
Шрифт Times New Roman, зеленого цвета, увеличенный на еденицу.
Красный текст, шрифт Courier.

Если указано size="+1"или size="-1", то это означает, что размер меняется относительно базового на указаную величину.

Тег <font> хоть и поддерживается браузерами, но считается устаревшим и от его применения рекомендуется отказаться и использовать стили CSS.

Задать цвет текста всей страницы

гораздо удобнее в теге <body>. Для этого ему нужно придать атрибут text и прописать значение все также используя либо RGB-значение в шестнадцатиричной системе, либо однин из 16 базовых цветов.

Заодно можно задать цвет фона страницы. Для этого используется атрибут bgcolor.

<body bgcolor="black" text="red">

В этом случае фон будет черным, а текст красным.

Фоновый рисунок

Чтобы залить фон не цветом, а каким-нибудь рисунком, нужно в теге <body> прописаить атрибут background. В значении атрибута прописать путь к желаемому изображению:

<body background="images/fon.gif">

Подробнее о пути к изображению на странице по работе с картинками >>

Тег HR

Как ни странно, этот тег тоже относится к тегам форматирования текста.

Тег <hr> выводит в тексте документа горизонтальную линию. Перед и после линии помещается пустая строка. Закрывающий тег не требуется.

Атрибуты:

align — задает выравнивание линии. Может принимать значения: left, center, right. По умолчанию center;
color — задает цвет линии;
size —задает толщину линии в пикселах;
width — задает ширину линии в пикселах или процентах от ширины окна браузера;
noshade — создает линию без тени. Атрибут не требует указания значения. Без этого атрибута линия отображается объемной.