Установите ширину границы в начале в направлении блока:
div {
border-block-start-style: solid;
border-block-start-color: pink;
}
Попробуйте сами »
Определение border-block-start-color
CSS свойство border-block-start-color определяет ширину границы элемента в начале в направлении блока.
Примечание: CSS свойство border-block-start-color вступит в силу, когда будет установлено свойство border-block-start-style.
CSS свойство
border-block-start-color свойство очень похоже на свойства
border-bottom-width,
border-left-width,
border-right-width и
border-top-width, но свойство
border-block-start-color зависит от направления блока.
Примечание: Связанное CSS свойство
writing-mode определяет направление блока. Это влияет на то, где находятся начало и конец блока, а также на результат свойства border-block-start-color. Для страниц на английском языке направление строки - слева направо, а направление блока - вниз.
| Значение по умолчанию: | Текущий цвет элемента |
|---|---|
| Унаследовано: | no |
| Анимируемый: | yes. Читайте о animatable Попробуй |
| Версия: | CSS3 |
| JavaScript синтаксис: | object.style.borderBlockStartColor="pink" Попробуй |
Поддержка border-block-start-color
Цифры в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.
| Свойство | |||||
|---|---|---|---|---|---|
| border-block-start-color | 69.0 | 79.0 | 41.0 | 12.1 | 56.0 |
Синтаксис border-block-start-color
border-block-start-color: color|transparent|initial|inherit;
Значения border-block-start-color
| Значение | Описание | Демонстрация |
|---|---|---|
| color | Определяет цвет границы. Смотрите на CSS Значения цвета для получения полного списка возможных значений цвета. Цвет по умолчанию - текущий цвет элемента. | Демо ❯ |
| transparent | Определяет, что цвет границы должен быть прозрачным | Демо ❯ |
| initial | Устанавливает для этого свойства значение по умолчанию. Читайте о initial | |
| inherit | Наследует это свойство от своего родительского элемента. Читайте о inherit |
Примеры border-block-start-color
Свойство writing-mode
На положение цвета границы в начале в направлении блока влияют CSS свойство writing-mode:
div {
border-block-start-style: solid;
writing-mode: vertical-rl;
border-block-start-color: blue;
}
Попробуйте сами »
Страницы по теме border-block-start-color
CSS Учебник: CSS Границы
CSS border свойство: CSS border свойство
CSS border-block свойство: CSS border-block свойство
CSS border-block-color свойство: CSS border-block-color свойство
CSS border-block-end-color свойство: CSS border-block-end-color свойство
CSS border-block-start-style свойство: CSS border-block-start-style свойство
CSS border-bottom-color свойство: CSS border-bottom-color свойство
CSS border-left-color свойство: CSS border-left-color свойство
CSS border-right-color свойство: CSS border-right-color свойство
CSS border-top-color свойство: CSS border-top-color свойство
CSS writing-mode свойство: CSS writing-mode свойство