outline-color¶
Свойство outline-color
указывает цвет внешней границы элемента.
В отличие от линии, задаваемой через border
, линия через свойство outline
отображается вокруг элемента, не влияя на ширину блока или его положение.
Интерфейс
Синтаксис¶
/* <color> values */
outline-color: #f92525;
outline-color: rgb(30, 222, 121);
outline-color: blue;
/* Keyword value */
outline-color: invert;
/* Global values */
outline-color: inherit;
outline-color: initial;
outline-color: unset;
Значения¶
invert
- Автоматически задаёт цвет линии, исходя из фона под ней для достижения максимального контраста. В CSS 2.1 браузеру разрешается игнорировать значение
invert
и вместо него использовать цвет линии заданный свойствомcolor
. <цвет>
- Задаёт цвет линии в любом допустимом для CSS формате.
Примечание¶
Chrome, Android и Safari не поддерживают значение invert
.
Значение по-умолчанию: invert
Применяется ко всем элементам
Спецификации¶
Поддержка браузерами¶
Описание и примеры¶
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>outline-color</title>
<style>
.block {
outline-style: dashed; /* Пунктирная граница */
outline-color: #be8b5e; /* Цвет границы */
padding: 10px; /* Поля вокруг текста */
background: #eedac8; /* Цвет фона */
}
</style>
</head>
<body>
<div class="block">
Воображение, на первый взгляд, начинает конструктивный
классицизм.
</div>
</body>
</html>