outline-style
Обновлено: 30.12.2022
outline-style
Устанавливает стиль внешней границы элемента. В отличие от линии, задаваемой через border, линия через outline отображается вокруг элемента, не влияя на ширину блока или его положение.
Краткая информация
| Значение по умолчанию | none |
| Наследуется | Нет |
| Применяется | Ко всем элементам |
| Анимируется | Нет |
Синтаксис
outline-style: none | dotted | dashed | solid | double | groove | ridge | inset | outset
Значения
| none | Граница не отображается. Это значение перекрывает свойство outline-width, если оно присутствует. |
| dotted | Линия состоящая из набора точек. |
| dashed | Пунктирная линия, состоящая из серии коротких отрезков. |
| solid | Сплошная линия. |
| double | Двойная линия. |
| groove | Создаёт эффект вдавленной рамки. |
| ridge | Создаёт эффект рельефной границы. |
| inset | Псевдотрёхмерная рамка, при которой правая и нижняя граница осветляется, а левая и верхняя линии затемняются. |
| outset | Псевдотрёхмерная рамка, при которой левая и верхняя граница имеют более светлый оттенок, чем заданный цвет, а правая и нижняя линии затемняются. |
Вид указанных стилей представлен на рис. 1.
Пример
В данном примере для браузера убирается пунктирная граница вокруг ссылок, возникающая при их активации. В первом абзаце рамка ещё будет отображаться, а во втором абзаце она скрывается с помощью значения none свойства outline-style.
Объектная модель
Объект.style.outlineStyle