CSS-свойство outline-style

CSS-свойство outline-style устанавливает стиль контура элемента. Однако во многих случаях краткое свойство outline удобнее для использования.

Значение по умолчанию:	`none`
Применяется к:	Все элементы
Наследование:	Нет
Анимирование:	Нет. Анимируемые свойства
Версия:	CSS 2, 3

Синтаксис

Синтаксически свойства задаются по следующему шаблону:

outline-style: none | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit

Примеры написания кода свойства outline-style:

p {
    outline-style: double;
    outline-width: 5px;
}

Значения свойств

В следующей таблице описаны значения этого свойства.

Значение	Описание
`none`	Контур не будет отображаться. Это значение установлено по умолчанию.
`dotted`	Отображает контур в виде серии точек.
`dashed`	Отображает контур в виде серии коротких отрезков, то есть штрихов.
`solid`	Отображает контур в виде одной сплошной линии.
`double`	Отображает контур в виде двух параллельных сплошных линий с некоторым промежутком между ними. Ширина двух строк и расстояние между определяется значением `outline-width`.
`groove`	Отображает контур, будто «вырезан» на холсте. Это создает впечатление 3D изображения, которое обычно достигается путем создания тени из двух цветов, которые немного светлее и темнее, чем `outline-color`.
`ridge`	Отображает контур, который имеет противоположный эффект `groove`. Это также создает впечатление трехмерности, контур выглядит так, как будто он выходит из холста.
`inset`	Отображает контур, из-за которого окно элемента выглядит так, как будто оно встроено в холст. Это создает впечатление трехмерного изображения, которое обычно достигается путем создания тени из двух цветов, которые немного светлее и темнее, чем `outline-color`.
`outset`	Отображает контур, который имеет противоположный эффект `inset`. Это также создает впечатление трехмерности, очертания заставляют элемент выглядеть так, как будто она выходит из холста.
`initial`	Устанавливает это свойство в значение по умолчанию.
`inherit`	Если указан, связанный элемент принимает вычисленное значение своего родительского элемента `outline-style`.