Сокращенные свойства CSS: border

Без категорий | Amber | Комментировать запись

Сокращение CSS border довольно простое в использовании. По сути это универсальное свойство, которое позволяет нам комбинировать ширину, стиль и цвет границы в одну строку:

border: 5px dashed #DF5B9C;

Следовательно, это свойство хорошо подходит для тех случаев, когда вы хотите определить все границы одновременно. Если какое-то из значений не указано, ему будет автоматически присвоено исходное значение (как и в любом другом универсальном свойстве).

Примечание: Свойство border нельзя использовать для определения пользовательского значения border-image; оно устанавливает его в начальное значение, none.

При этом данное свойство также поддерживает сокращение для каждой стороны:

border-bottom: 2px solid #00BDA7;

Свойство border-style

Сокращенное CSS-свойство border-style определяет стиль линии для всех четырех сторон границы элемента.

border-style может принимать одно из следующих значений: dashed, dotted, double, groove, ridge, inset, outset, solid, hidden, none, initial или inherit.

Читайте также: Функции CSS: как работает calc()