CSS: Свойство border-width

Технические моменты создания сайтов и других Web-приложений.

CSS: Свойство border-width

Сообщение Александр » 18 сен 2013, 16:07

Данное свойство отвечает за ширину рамки одновременно со всех сторон или с каждой стороны по отдельности.
Если будет указано одно значение, ширина рамки будет применена ко всем четырем сторонам.
Если будет указано два значения, то первое значение устанавливает значение для верхней и нижней стороны рамки, а второе значение для левой и правой стороны рамки.
Если будет указано три значения то первое устанавливает значение для верхней стороны рамки, второе значение для левой и правой стороны рамки, третье для нижней стороны рамки.
Если будет указано четыре значения, то будет установлено поочередное значение для каждой стороны рамки.
Приведенный ниже пример наглядно это демонстрирует.
Пример кода:
Код: выделить все
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
 <head>
  <meta charset="utf-8">
  <title>Свойство border-width</title>
  <style>
   p {
    border-style: dashed; /* Стиль рамки вокруг параграфа */
    border-width: 4px 16px 12px 8px; /* Толщина границы */
   border-color: green; /* Цвет границы */
    padding: 12px; /* Поля вокруг текста */
   }
  </style>
 </head>
 <body>
  <p>Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст </p>
 </body>
</html>

Результат примера:
bw.png
Свойство управляющее шириной рамки
bw.png (10.02 KiB) Просмотров: 2892
Аватар пользователя
Александр
Продвинутый Юзер
 
Сообщений: 218
Зарегистрирован: 12 мар 2012, 16:32

Вернуться в Программирование для Web

Кто сейчас на форуме

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 1

cron