Границя (border)

У кожного блокового елемента розмітки є границя. Від границі відраховуються відступи (margin і padding). Вздовж границі "плаваючого" блоку його обтікає текст.

Для опису границь блоків застосовуються наступні атрибути:

• border-top-width — ширина верхньої границі блоку;
• border-bottom-width — ширина нижньої границі блоку;
• border-left-width — ширина лівої границі блоку;
• border-right-width — ширина правої границі блоку;
• border-width — ширина границі блоку. Задається в тому випадку, якщо ширина границі блоку однакова по всьому периметрі блоку;
• border-color — колір границі блоку. Відповідно до специфікації CSS1 може бути заданий для кожної з границь блоку. Наприклад, border-right-color:red. Може задаватися як мнемонікою (red, blue, navy і т.п.), так і в нотації RGB (border-color:#003366). Вказівка кольору для кожної з границь підтримується не всіма браузерами;
• border-style — тип лінії границі блоку. Може приймати значення: none, dotted, dashed, solid, double, groove, ridge, inset, outset. Відповідно до специфікації CSS1, може бути заданий для кожної з границь блоку. Наприклад, border-right-style:dotted. Вказівка типу лінії границі підтримується не всіма браузерами.

Для опису границі немає необхідності вказувати в стилі всі атрибути. Існує скорочений запис атрибутів. Наприклад, для опису верхньої лінії границі можна використовувати запис типу:

Якщо необхідно обмежити блок тексту границею, то це може виглядати приблизно так:

У цьому прикладі ми використовували наступний опис стилю відображення границі:

Застосування границі для позначення блоку — не найкращий спосіб оформлення документа. У всякому разі, його застосовують нечасто.

Вказуючи границю в Internet Explorer, потрібно обов'язково визначати її тип, у противному випадку вона не буде відображатися.