Спецификация HTML 4.01 + Спецификация CSS2



              

Динамические контуры: свойство 'outline'


Иногда авторам таблиц стилей может понадобиться создать контуры вокруг визуальных объектов, таких как кнопки, активные поля формы, карты изображений и т.п., чтобы выделить их. Контуры CSS2 отличаются от рамок в следующем:

  • Контуры не занимают пространство.
  • Контуры могут не быть прямоугольными.
  • Свойства контуров управляют стилем этих динамических контуров.

    'outline'

    Значение:[ <'outline-color'> || <'outline-style'> || <'outline-width'> ] | inherit
    Начальное:см. конкретные свойства
    Применяется:ко всем элементам
    Наследуется:нет
    Процентное:N/A
    Носитель:визуальный, интерактивный

    'outline-width'

    Значение:<border-width> | inherit
    Начальное:medium
    Применяется: ко всем элементам
    Наследуется:нет
    Процентное: N/A
    Носитель:визуальный, интерактивный

    'outline-style'

    Значение:<border-style> | inherit
    Начальное:none
    Применяется: ко всем элементам
    Наследуется:нет
    Процентное:  N/A
    Носитель:визуальный, интерактивный

    'outline-color'

    Значение:<color> | invert | inherit
    Начальное:invert
    Применяется: ко всем элементам
    Наследуется:нет
    Процентное: N/A
    Носитель:визуальный, интерактивный

    Контур, созданный свойствами контуров, прорисовывается "поверх" бокса, т.е. контур всегда сверху и не влияет на позицию и размер бокса или любых других боксов. Следовательно, отображение или подавление контуров не вызывает перерисовки.

    Контур прорисовывается сразу за краем рамки.

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

    Свойство 'outline-width'

    принимает те же значения, что и 'border-width'.

    Свойство 'outline-style'

    принимает те же значения, что и 'border-style', за исключением 'hidden', который не является допустимым стилем контура.

    Свойство 'outline-color'




    Содержание  Назад  Вперед