Свойства блоков
Блочные элементы (блоки текста либо box) разрешают оперировать с текстом в терминах прямоугольников, которые данный текст занимает. При этом блок текста становится элементом дизайна страницы с теми же свойствами, что и картинка, таблица либо прямоугольная область приложения.
Блок текста владеет свойствами: высоты(height), ширины(width), границы(border), отступа(margin), набивки(padding), произвольного размещения(float), управления обтеканием(clear).
Графически свойства дозволено представить дальнейшим образом:
В данном примере внутри окна браузера размещен блочный элемент(DIV), вовнутрь которого размещен еще один блочный элемент(P). DIV имеет белый фон и рубеж. Параграф имеет рубеж и желтый фон.
С шириной и высотой блока текста больше либо менее все внятно. Задаваться они могут в типографских пунктах(pt), пикселях(px) и условных единицах(em):
<div style="width:200px;">пиксели</div>
<div style="width:200pt;">типографские пункты</div>
<div style="width:5em;">условные единицы</div>
С высотой блока текста следует быть осмотрительным, т.к. в четвертой версии NN многие из признаков CSS не поддерживаются, и высота обыкновенного блочного элемента - один из них.
Расстояние от границы блочного элемента до границы вложенного в него блочного элемента назыается padding. В терминологии данного учебного пособия для обозначения данного свойства употребляется слово "набивка" либо словосочетание "внутренний отступ".
Отступ от "набивки" внешнего блочного элемента до границы вложенного элемента именуется margin. Для его обозначения мы будем употреблять термин "отступ" либо словосочетание "внешний отступ".
Таким образом, padding и margin характеризуют отступы блочного элемента относительного начала его оглавления и касательно границы охватывающего его элемента разметки соответственно:
Отступы и "набивка" могут быть левыми, правыми, верхними и нижними. CSS дозволяет варьировать всякие из них. Больше детально отступы обсуждаются в разделе "Отступы(margin)", а "набивка" в разделе "Набивка(padding)".
При отображении блока текста дозволено показать его видимую рубеж. CSS дозволяет определить ее жанр, ширину и цвет.При использовании видимой границы следует рассматривать специфику браузеров. Одним из осмысленных методов использования границы явлется видимое лимитация "плавающих" блоков текста.
"Плавающий" текстовый блок дозволяет реализовать возможность обтекания этого блока текстом:
Обтекание одного текста иным происходит в том же самом ключе, что и обтекание текстом картинки либо таблицы. Текст охватывающего блока тяготится втиснуться в свободное место, оставленное "плавающим" блоком. Когда граница "плавающего" блока кончается, охватывающий блок распространяется на всю ширину отведенного для текста пространства.
CSS дозволяет реализовать выравнивание блока текста не только по краю страницы, но и по центру(только в NN).
Блок разместился по центру страницы, если страница просматривается в NN. CSS не поддерживает значение признака float равным center.
Таким образом, блок текста с точки зрения размещения на странице равноценен картинкам либо прямоугольным областям приложений.