Свойство border-block-style CSS

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

соответствующие CSS свойства атрибут устанавливает стиль рамки элемента в направлении блока.

соответствующие CSS свойства значение атрибута можно установить несколькими способами:

если соответствующие CSS свойства атрибут имеет два значения:

border-block-style: solid;
  • стиль рамки у начала блока равен пунктирной линии
  • стиль рамки у конца блока равен штриховой линии

если соответствующие CSS свойства атрибут имеет одно значение:

border-block-style: dashed;
  • стиль рамки у начала и конца блока равен пунктирной линии

CSS соответствующие CSS свойства атрибуты CSS и CSS-атрибуты border-bottom-styleиborder-left-styleиborder-right-style и border-top-style 非常相似，但 соответствующие CSS свойства 属性依赖于块方向。

Очень похожи, ноСвойство зависит от блокового направления. Пример 2: сочетание свойств writing-mode Обратите внимание: соответствующие CSS свойства Определяет блоковое направление. Это влияет на начало и конец блока, а также

border-block-style

Результат свойств. Для английских страниц, направлением Inline является слева направо, а блоковым — вниз.

Пример

Пример 1
  Установить стиль границ в блоковом направлении:
writing-mode: vertical-rl;
#example1 {
  border-block-style: solid;
writing-mode: vertical-rl;

border-block-style: dotted;

#example2 {

border-block-style: dashed dotted; Пример 2: сочетание свойств writing-mode Положение границ в начале и конце блока зависит от

writing-mode
  Влияние свойств:
  div {
writing-mode: vertical-rl;

border-block-style: dotted;

}

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

CSS синтаксис

border-block-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit; Значение атрибута
none Значение
Описание Значение по умолчанию. Определяет отсутствие границ.
hidden Как и none, но за исключением решения конфликтов границ таблицы.
dashed Определение пунктирных границ.
solid Определение сплошных границ.
double Определение двойных границ.
groove

Определение 3D вогнутых границ.

Эффект зависит от значения border-color.
ridge

Определение 3D выпуклых границ.

Эффект зависит от значения border-color.
inset

Определение 3D вогнутых границ.

Эффект зависит от значения border-color.
outset

Определение 3D выпуклых границ.

Эффект зависит от значения border-color.
initial Установить этот атрибут в его значение по умолчанию. См. также initial.
inherit Этот атрибут наследуется от родительского элемента. См. также inherit.

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

Значение по умолчанию: none
Ингерит: Нет
Создание анимации: Не поддерживается. См. также:Свойства анимации.
Версия: CSS3
JavaScript синтаксис: object.style.borderBlockStyle="dotted"

Поддержка браузеров

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

Chrome Edge Firefox Safari Opera
87.0 87.0 66.0 14.1 73.0

Соответствующие страницы

Учебное пособие:Рамка в CSS

Ссылка:Свойство border CSS

Ссылка:Свойство border-block CSS

Ссылка:Свойство border-block-end-style CSS

Ссылка:Свойство border-block-start-style CSS

Ссылка:Свойство border-bottom-style CSS

Ссылка:CSS attribute border-left-style

Ссылка:CSS attribute border-right-style

Ссылка:CSS attribute border-top-style

Ссылка:Свойство writing-mode в CSS