opacity¶
Свойство opacity
определяет уровень прозрачности элемента.
При частичной или полной прозрачности через элемент проступает фоновый рисунок или другие элементы, расположенные ниже полупрозрачного объекта.
Шрифт и Цвет
- font
- font-family
- font-feature-settings
- font-kerning
- font-language-override
- font-optical-sizing
- font-size
- font-size-adjust
- font-stretch
- font-style
- font-synthesis
- font-variant
- font-variant-alternates
- font-variant-caps
- font-variant-east-asian
- font-variant-ligatures
- font-variant-numeric
- font-variant-position
- font-variation-settings
- font-weight
- line-height
- color
- color-adjust
- opacity
Синтаксис¶
opacity: число;
Значения¶
В качестве значения выступает число из диапазона [0.0; 1.0]
. Значение 0
соответствует полной прозрачности элемента, 1
, наоборот — его непрозрачности. Дробные числа вида 0.6
устанавливают полупрозрачность. Допускается писать числа без нуля впереди, вида opacity: .6
.
Значение по-умолчанию:
opacity: 1;
Применяется ко всем элементам
Спецификации¶
Поддержка браузерами¶
Описание и примеры¶
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>opacity</title>
<style>
.semi {
opacity: 0.5; /* Полупрозрачность элемента */
}
</style>
</head>
<body>
<p>
<img src="image/igels.png" alt="Обычный рисунок" />
<img
src="image/igels.png"
alt="Полупрозрачный рисунок"
class="semi"
/>
</p>
</body>
</html>