|

|

|

|
Модель
форматирования |

|
Каждый элемент документа занимает прямоугольную область, которая
помещена последовательно еще в три области: подложка
(padding), рамка (border), поля (margin). Рисунок
снизу иллюстрирует это модель.
Свойство полей, подложки и рамки задается следующим образом
|
{Контейнер[-Сторона][-Свойство]: значение;}
|
где контейнер это одно из слов margin, padding или border,
сторона – это left, right, top или bottom, свойство – это название определяемого
свойства. Название сторон можно пропустить, если вы хотите применить
стилевое правило ко всем сторонам. Название свойства также можно
пропустить, если вы хотите использовать краткое свойств. Пример:
|
td {border-left: solid 1px
blue} table {border-left: double 3px
black}
| После селектора Контейнер[-Сторона] вы можете перечислить значение
свойств рамки в произвольном порядке.

|
Свойство
border-color |

|
Это свойство задает цвет рамки. Оно может принимать от одного
до четырех значений. Если установлено только одно значение,
то все четыре стороны рамки будут одного цвета. Два значения приводят
к тому, что верх и низ рамки окрашиваются в первый цвет, а
левая и правая стороны рамки – в другой. В случае трех значений
первое будет цветом верха рамки, второе цветом левой и правой
стороны, а третье задаст цвет низа. Четыре значения определяют цвет каждой
из сторон рамки в следующем порядке: верха, правой стороны, левой
стороны, низа. Также можно явно задавать цвет некоторой стороны рамки,
пример:
|
h1, h2,
h3{border-left-color:
red; border-right-color: green}
|

|
Свойство
border-width |

|
Свойство border-width определяет толщину
рамки. Как и свойство border-color может
принимать от одного до четырех значений в том же порядке.
Для указания толщины могут использоваться стандартные единицы длины или
одно из ключевых слов: thin (тонкая), medium (средняя), thik
(тонкая). Можно также определить толщину конкретной стороны, пример:

|
Свойство
border-style |

|
Это свойство используется для украшения рамки и может принимать
одно из следующих значений: none, dotted (точечная), dashed
(штриховая), double (двойная), solid (сплошная), groove
(паз), outset (приподнятая), inset (утопленная), ridge
(ребро). Значение none применяется
по умолчанию. Популярные броузеры некоректно поддерживают это
свойство, так что не увлекайтесь им.

|
Свойство
margin |

|
Этим свойством можно установить ширину полей. Можно задать ширину всех
полей сразу, присвоив свойству margin значение,
или каждого поля по отдельности, задав значения свойствам margin-left, margin-right,
margin-top, margin-bottom. Это свойство может принимать значение
auto, указывающее броузеру, что надо применить
стандартное значение ширины полей.

|
Свойство
padding |

|
Этим свойством можно установить ширину подложки. Можно задать ширину
всех подложек (верхней, нижней, правой и левой) сразу, присвоив
свойству padding значение, или каждого поля
по отдельности, задав значения свойствам padding-left, padding-right, padding-top, padding-bottom. Это свойство может принимать значение
auto, указывающее броузеру, что надо применить
стандартное значение ширины полей.

|
Свойства
height и width |

|
Свойства height и width определяют высоту и ширину элемента
соответственно. Значением этих свойств может быть длина, процентное
значение или ключевое слово auto, которое
подразумевает, что элемент обладал изначально какой-то высотой/шириной
и отображает его в соответствии с этим значением. Эти два
свойства применяются обычно к таблицам и изображениям. Однако
его можно применять ко всем элементам CSS. Вкупе со свойством Overflow (см. раздел визуальные свойства)
можно достичь интересных эффектов.

|
Свойство
clear |

|
Это свойство очень похоже на атрибут clear тега <br> (за описанием
этого тега загляните в НTML
справочник). Это свойство говорит броузеру, помещать ли содержимое
тега рядом с "плавающим" элементом или на первой строке перед
ним. Значением свойства clear может быть none, left, right или both. Значение none принято по умолчанию и подразумевает,
что броузер размещает содержимое тега рядом с плавающими элементами
по обе стороны, если там есть место. Значение left запрещает располагать содержимое слева
от плавающего элемента, right – справа.
Both не допускает размещение содержимого
тега рядом плавающим элементом вообще.

|
Свойство
float |

|
Свойство float описывает область отображения
тега в качестве плавающего элемента. Это свойство аналогично атрибуту
align тегов <img> и <table>, но оно может применяться к любым
HTML-элементам.
Свойство float принимает одно из трех
значений: left, right,
none. Значение none
принято по умолчанию, оно выключает свойство float. Значения left
и right приказывают броузеру поместить
содержимое элемента слева и справа от потока соответственно
и позволить другому содержимому обтекать его.
|

|