CSS3
September 29, 2020

① Краткая запись внешнего контура: свойство outline

Спецификация CSS3 UI описывает свойства и значения, связанные с пользовательским интерфейсом.


Содержание:

1. Краткая запись внешнего контура: свойство outline

2. Толщина внешнего контура: свойство outline-width

3. Узор внешнего контура: свойство outline-style

4. Цвет внешнего контура: свойство outline-color

5. Смещение внешнего контура: свойство outline-offset

6. Изменение размера блоков: свойство resize

7. Стилизация курсора: свойство cursor

8. Цвет каретки вставки: свойство caret-color


Свойства внешнего контура

Контуры позволяют выделять активные элементы интерфейса, такие как, кнопки, поля формы, карты изображений и т.п.

Браузеры часто отображают контуры элементов в состоянии :focus, поэтому не рекомендуется делать контур невидимым для таких элементов без альтернативного механизма выделения.

Контур всегда находится сверху и не влияет на положение или размер блока, или любых других блоков. Поэтому отображение или скрытие контуров не вызывает перекомпоновку.

Части контура необязательно должны быть прямоугольными, например, он повторяет закругленные углы элемента.


Краткая запись внешнего контура: свойство outline

Свойство представляет краткую запись свойств outline-color outline-style outline-width. Значение по умолчанию outline: invert none medium.

Свойство не наследуется.

Синтаксис

CSS
outline: dotted;
outline: gold solid;
outline: inset thick;
outline: pink solid 2px;
outline: inherit;
outline: initial;

Продолжение в следующей статье!