outline-width
Свойство outline-width задаёт толщину линии контура вокруг элемента. В отличие от свойства border-width, для outline-width нельзя задать линию для каждой стороны элемента индивидуально.
Чтобы outline-width работал, необходимо установить у свойства outline-style любое значение кроме none.
Краткая информация
Значение по умолчанию | medium |
---|---|
Наследуется | Нет |
Применяется | Ко всем элементам |
Анимируется | Да |
Синтаксис
outline-width: thin | medium | thick | <размер>
Значения
- thin
- Тонкая линия. Значение в пикселях может изменяться в зависимости от браузера, но обычно составляет 1 пиксель.
- medium
- Линия средней толщины (3 пикселя).
- thick
- Линия большой толщины (6 пикселей).
- <размер>
- Для точной установки толщины можно использовать любые единицы размера принятые в CSS.
Песочница
Винни-Пух был всегда не прочь немного подкрепиться, в особенности часов в одиннадцать утра, потому что в это время завтрак уже давно окончился, а обед ещё и не думал начинаться. И, конечно, он страшно обрадовался, увидев, что Кролик достаёт чашки и тарелки.
div { background: #e4efc7; padding: 10px; outline: dotted #333; outline-width: 0px; }
Пример
Код примера скопирован в буфер
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>outline-width</title> </head> <body> <div class="block"> Кондуктометрия мягко передает электронный способ получения независимо от последствий проникновения метилкарбиола внутрь. </div> </body> </html>
Результат примера показан на рис. 1.
Рис. 1. Использование свойства outline-width
Объектная модель
Объект.style.outlineWidth
Спецификация
Спецификация | Статус |
---|---|
CSS Basic User Interface Module Level 4 | Рабочий проект |
CSS Basic User Interface Module Level 3 | Рекомендация |
CSS Level 2 (Revision 1) | Рекомендация |
Браузеры
8 | 12 | 1 | 7 | 1.2 | 1.5 |
1 | 1.5 | 7 | 1.2 |