opacity
Поддержка браузерами
12.0+ | 9.0+ | 2.0+ | 4.0+ | 9.0+ | 3.1+ |
Примечание: браузер IE8 и более ранние версии поддерживает альтернативное CSS свойство filter
.
Пример: filter: Alpha(opacity=50);
Описание
CSS свойство opacity
(в переводе с анг. - непрозрачность) устанавливает уровень прозрачности элемента. Прозрачность задаётся числом от 0 (полная прозрачность) до 1 (полная непрозрачность).
Значение прозрачности применяется ко всему элементу, включая его содержимое, даже не смотря на то, что значение не наследуется дочерними элементами. Таким образом элемент, его содержимое, его дочерние элементы и содержимое дочерних элементов имеют одинаковый уровень прозрачности, даже если у самого элемента и его дочерних элементов установлены разные значения прозрачности.
Прозрачность картинки задаётся также с помощью CSS свойства opacity
, примеры и код вы можете посмотреть в нашем самоучителе в уроке "CSS: Прозрачность".
Если вам нужно установить прозрачность только для фона блока, то следует использовать CSS свойство background или background-color со значением цвета в формате RGBA или HSLA. Если нужно задать прозрачность только для текста, то следует использовать свойство color со значением цвета в формате RGBA или HSLA.
Значение по умолчанию: | 1 |
---|---|
Применяется: | ко всем элементам |
Анимируется: | да |
Наследуется: | нет |
Версия: | CSS3 |
Синтаксис JavaScript: | object.style.opacity=0.5 |
Синтаксис
opacity: число|inherit;
Значения свойства
Значение | Описание |
---|---|
число | Указывает прозрачность. От 0.0 (элемент полностью прозрачный) до 1 (элемент полностью непрозрачный). |
inherit | Указывает, что значение наследуется от родительского элемента. |
Пример
Элемент, который будет менять прозрачность.
background-color: lightblue;
width: 200px;
height: 100px;
opacity: 0.9;
}