CSS attribute border-inline-start-width

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

border-inline-start-width Ширина рамки элемента настройки свойств в начале строки.

Обратите внимание:Чтобы сделать border-inline-start-width Свойства становятся активными, их необходимо установить border-inline-start-style .

свойствами CSS border-inline-start-width Свойства связаны с border-bottom-width,border-left-width,border-right-width и border-top-width Свойства очень похожи, но border-inline-start-width Свойство зависит от инлайнового направления.

Обратите внимание:и соответствующие CSS свойства writing-mode,text-orientation и direction Определяет инлайновое направление. Это влияет на положение начала и конца строки, а также border-inline-start-width Результат свойств. Для английских страниц, инлайновое направление слева направо, блоковое направление снизу.

Пример

Пример 1

Установить ширину рамки в начале инлайнового направления:

div {
  border-inline-start-style: solid;
  border-inline-start-width: 10px;
}

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

Пример 2: Сочетание с свойством writing-mode

Положение рамки в начале инлайнового направления зависит от writing-mode Влияние свойств:

div {
  border-inline-start-style: solid;
  writing-mode: vertical-rl;
  border-inline-start-width: 5px;
}

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

Пример 3: Сочетание с свойством direction

Положение рамки в начале и конце инлайнового направления зависит от direction Влияние свойств:

div {
  direction: rtl;
  border-inline-start-width: 10px;
}

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

CSS синтаксис

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

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

Значение Описание
medium Определяет среднюю рамку. Значение по умолчанию.
thin Определяет тонкую рамку.
thick Определяет толстую рамку.
length Позволяет определить толщину рамки. См. также:Единицы CSS.
initial Установить это свойство в его значение по умолчанию. См. также: initial.
inherit Ингеритация этого свойства из родительского элемента. См. также: inherit.

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

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

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

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

Chrome Edge Firefox Safari Opera
69.0 79.0 41.0 12.1 56.0

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

Инструкции:CSS-границы

См. также:Свойство border CSS

См. также:Свойство border-inline CSS

См. также:Свойство border-inline-end-width CSS

См. также:CSS attribute border-inline-start-style

См. также:Свойство border-bottom-width CSS

См. также:CSS attribute border-left-width

См. также:CSS attribute border-right-width

См. также:CSS attribute border-top-width

См. также:Свойство direction в CSS

См. также:Свойство text-orientation в CSS

См. также:Свойство writing-mode в CSS