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

Определение и использование

Сокращенный атрибут border-width устанавливает ширину всех рамок элемента, или устанавливает ширину отдельных рамок.

Действует только при том, что стиль рамки не равен none. Если стиль рамки равен none, фактическая ширина рамки будет сброшена до 0. Запрещается указывать отрицательные значения длины.

Пример 1

border-width:thin medium thick 10px;
  • Верхняя рамка тонкая
  • Правая рамка средняя
  • Нижняя рамка толстая
  • Левая рамка 10px шириной

Пример 2

border-width:thin medium thick;
  • Верхняя рамка 10px
  • Правая и левая рамки средние
  • Нижняя рамка толстая

Пример 3

border-width:thin medium;
  • Верхняя и нижняя рамки тонкие
  • Правая и левая рамки средние

Пример 4

border-width:thin;
  • Все 4 рамки тонкие

Пример

Установить ширину всех 4 рамок:

p
  {
  border-style:solid;
  border-width:15px;
  }

Попробуйте сами

Синтаксис CSS

border-width: medium|thin|thick|length|initial|inherit;

Значение свойства

Значение Описание
Определить тонкую рамку. тонкий
средний По умолчанию. Определить среднюю рамку.
толстый Определить толстую рамку.
length Позволяет вам настроить ширину рамки.
inherit Установить, что ширина рамки должна наследоваться от родительского элемента.

Более примеров

Все свойства толщины рамки в одном заявлении
Этот пример демонстрирует использование сокращенного свойства для установки всех свойств толщины рамки в одном заявлении.

Технические детали

Значение по умолчанию: средний
Наследование: нет
Версия: CSS1
Синтаксис JavaScript: объект.style.borderWidth="тонкий толстый"

Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5

Дополнительные материалы:

Уроки CSS:Рамки CSS

Руководство по HTML DOM:свойство borderWidth