Свойство border-bottom-color CSS
- предыдущая страница border-bottom
- следующая страница border-bottom-left-radius
Определение и использование
border-bottom-color устанавливает цвет нижней границы элемента.
Можно определить только чистый цвет, и граница появляется только когда стиль границы не equals none или hidden.
Комментарий:Always declare the border-style property before the border-color property. The element must have a border before you change its color.
Дополнительная информация:
CSS учебник:CSS Rahmen
CSS справочник:border-bottom свойство
HTML DOM справочник:borderBottomColor свойство
Пример
Установка цвета нижней границы:
p { border-style:solid; border-bottom-color:#ff0000; }
CSS syntax
border-bottom-color: color|transparent|initial|inherit;
Значение свойства
Значение | Описание |
---|---|
color_name | Указывается цвет границы по имени цвета (например, red). |
hex_number | Указывается цвет границы в формате шестнадцатеричного числа (например, #ff0000). |
rgb_number | Указывается цвет границы в формате rgb кода (например, rgb(255,0,0)). |
transparent | Значение по умолчанию. Цвет границы прозрачен. |
inherit | Указывается, что цвет границы должен быть ингеритирован от родительского элемента. |
Технические детали
Значение по умолчанию: | не указано |
---|---|
Ингеритность: | no |
Версия: | CSS1 |
JavaScript syntax: | object.style.borderBottomColor="blue" |
Более примеров
- Установка цвета нижней границы
- Этот пример демонстрирует, как установить цвет нижней границы.
Поддержка браузерами
Числа в таблице указывают на первую версию браузера, которая поддерживает это свойство полностью.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Комментарий:Браузер Internet Explorer 6 (и более ранние версии) не поддерживает значение свойства "transparent".
Комментарий:Браузеры Internet Explorer 7 и более ранние версии не поддерживают значение "inherit". Internet Explorer 8 требует !DOCTYPE. Internet Explorer 9 поддерживает "inherit".
- предыдущая страница border-bottom
- следующая страница border-bottom-left-radius