border-top-color

Internet Explorer

Chrome

Opera

Safari

Firefox

Android

iOS

6.0+

8.0+

1.0+

3.5+

1.0+

1.0+

1.0+

1.0+

Краткая информация

Значение по умолчанию

Нет

Наследуется

Нет

Применяется

Ко всем элементам

Ссылка на спецификацию

http://www.w3.org/TR/CSS21/box.html#border-color-properties

Версии CSS

CSS 1

CSS 2

CSS 2.1

CSS 3



+

Описание

Задает цвет границы сверху элемента.

Синтаксис

border-top-color: цвет | transparent | inherit

Значения

transparent

Устанавливает прозрачный цвет.

inherit

Наследует значение родителя.

Пример

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title> border-top-color </title>

<style>

h1 {

border-top-color: #ccc;/* Цвет линии сверху */

border-top-style: double;/* Стиль линии сверху */

border-top-width: 7px;/* Толщина линии сверху */

border-left-color: #ccc;/* Цвет линии слева */

border-left-style: solid;/* Стиль линии */

border-left-width: 2px;/* Толщина линии */

padding: 7px;/* Поля вокруг текста */

}

</style>

</head>

<body>

<h1>Lorem ipsum dolor sit amet</h1>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,

sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna

aliguam erat volutpat. Ut wisis enim ad minim veniam,

quis nostrud exerci tution ullamcorper suscipit

lobortis nisl ut aliquip ex ea commodo consequat.</p>

</body>

</html>

Результат данного примера показан на рис. 1.

Рис. 1. Применение свойства border-top-color

Объектная модель

[window.]document.getElementById("elementID").style.borderTopColor

Браузеры

Браузер Internet Explorer до шестой версии включительно при толщине границы 1px отображает dotted как dashed. При толщине 2px и выше значение dotted работает корректно. Эта ошибка исправлена в IE7, но только для всех границ толщиной 1px. Если одна из границ блока имеет толщину 2px и выше, то в IE7 значение dotted превращается в dashed.

Internet Explorer до версии 7.0 включительно не поддерживает значение hidden и  inherit.

Стиль границы в разных браузерах может несколько различаться при использовании значений grooveridgeinset или outset.

Категория:  Контуры и границы