CSS свойство border-color, поддержка в браузерах, примеры использования // Вебшкола онлайн



Перейти к справке CSS

p { border-style:solid; border-color:#ff0000 #0000ff;

}

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

Свойство CSS border-color задает цвет всех четырех бордюров. Свойсто border-color может иметь от одного до четырех значений.

Примеры:

• border-color:yellow green blue pink;
  • верхний бордюр желтого цвета
  • правый бордюр зеленого цвета
  • нижний бордюр синего цвета
  • левый бордюр розового цвета

• border-color:yellow green blue;
  • верхний бордюр желтого цвета
  • правый и левый бордюры зеленого цвета
  • нижний бордюр синего цвета

• border-color:yellow green;
  • верхний и нижний бордюры желтого цвета
  • правый и левый бордюры зеленого цвета

• border-color:yellow;
  • все бордюры желтого цвета

Заметка: для облегчения запоминания порядка окрашивания бордюров можно запомнить два простых правила:

1. Бордюры нумеруются с верхнего по часовой стрелки
2. Вертикальные бордюры имеют приоритет перед горизонтальными, т.е. если указано три цвета, два вертикальных имеют свои цвета, а левый бордюр получает цвет от правого.

Заметка: всегда задавайте свойство border-style перед свойством border-color. Элемент должен иметь бордюры, для которых вы хотите изменить цвет.

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

Свойство border-color поддерживается всеми основными браузерами.

Заметка: Internet Explorer 6 и более ранние версии не поддерживают значение «transparent» (прозрачный).

Заметка: ни одна из версий IE (включая IE8) не поддерживает значение inherit.

Возможные значения свойства border-color

Связанные страницы

Учебник CSS: CSS border

Перейти к справке CSS