Расположение элементов
В HTML-документ текст можно ввести непосредственно. Другие видимые элементы (графические изображения, кнопки, поля ввода данных и т.д.) задаются с помощью специальных тегов. Например, для вставки изображения служит тег <img>. Тексты и теги видимых элементов записываются в документе последовательно и так же последовательно выполняются браузером. В результате они отображаются в окне браузера. Многие элементы по умолчанию располагаются рядом друг с другом по горизонтали или вертикали в зависимости от того, как они вписываются в размеры окна браузера. Для контроля порядка расположения элементов в окне браузера служат специальные средства: теги, атрибуты и таблицы стилей. На расположение элементов влияют следующие теги:
1) <p> - абзац;
2) <br> - переход на следующую строку;
3) <nobr> - запрет переноса слов и режима обтекания текстом;
4) <wbr> - разрешение возможности переноса в блоке текста, заключенного в тег <nobr>;
5) <center> - выравнивание заключенных в этот тег элементов по центру;
6) <hr> - размещение горизонтальной полосы.
Тег <p> используется для выделения абзацев. Он приводит к вставке одной пустой строки и размещению находящегося за ним видимого элемента в следующей строке. Например, чтобы два элемента находились друг под другом и между ними была пустая строка, достаточно между тегами этих элементов вставить тег <p>:
<html>
<img src=”picture1.jpg”>
<p>
<img src=”picture2.jpg”>
</html>
Тег <p> является контейнерным, но закрывающий тег </p> необязателен.
Тег <p> имеет необязательные атрибуты align, style и title.
Атрибут align с возможными значениями center, left, right и justify, выравнивающими весь абзац по центру, левому краю, правому краю и одновременно по обоим краям окна соответственно.
Тег <br> служит для перехода на другую строку. Он не является контейнерным и не вставляет пустой строки. Тег <br> имеет необязательный атрибут clear, принимающий значения left, right и all, которые означают запрет выравнивания слева, справа и по обоим краям соответственно.
Тег <nobr> является контейнерным и предотвращает перенос заключенной в него строки. Если строка выходит за границу окна, то появляется горизонтальная полоса прокрутки.
Тег <wbr> вставляется в блок текста, заключенного в тег <nobr> для указания места возможного перевода строки, т.е. «мягкого переноса слов, который будет выполнен при необходимости.
Тег <hr> предназначен для вставки разделительных полос в документе. Тег <hr> имеет следующие необязательные атрибуты:
size – толщина полосы в пикселах;
width – длина полосы в пикселах;
align – способ выравнивания (принимает значения center, left и right для выравнивания по центру, левому и правому краю окна браузера соответственно);
noshade – создание сплошной черной полосы без тени.
Пример задания разделительных полос:
<html>
Обычная полоса
<hr>
Полоса толщиной 5
<hr size=5>
<p> Полоса толщиной 20 и шириной 200
<hr size=20 width=200>
<p> Сплошная черная полоса толщиной 5
<hr size=5 noshade>
</html>
