| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 9.0+ | 2.0+ | 1.7+ | 2.0+ | 1.0+ |
Коротка інформація
| Значення за замовчуванням | 1 |
|---|---|
| Успадковується | Ні |
| Застосовується | До всіх елементів |
| Відсотковий запис | Не застосовується |
| Посилання на специфікацію | http://www.w3.org/TR/css3-color/#transparency |
Версії CSS
| CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
|---|---|---|---|
Опис
Визначає рівень прозорості елемента веб-сторінки. При частковій або повній прозорості через елемент проглядається фоновий малюнок або інші елементи, розташовані нижче напівпрозорого об'єкта.
Синтаксис
opacity: значення
Значення
Як значення виступає число з діапазону [0.0; 1.0]. Значення 0 відповідає повній прозорості елемента, а 1, навпаки — його непрозорості. Дробові числа у вигляді 0.6 встановлюють напівпрозорість. Допускається писати числа без нуля перед, у вигляді opacity: .6.
Приклад
HTML5CSS2.1CSS3IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>прозорість</title>
<style>
.пів {
opacity: 0.5; /* Напівпрозорість елемента */
}
</style>
</head>
<body>
<p>
<img src="images/igels.png" alt="Звичайний малюнок">
<img src="images/igels.png" alt="Напівпрозорий малюнок" class="пів">
</p>
</body>
</html>Результат цього прикладу показаний на мал. 1.
Браузери
Firefox до версії 3.5 підтримує нестандартну властивість -moz-opacity.
Internet Explorer до версії 9.0 для зміни прозорості використовує фільтри, для цього браузера слід записати filter: alpha(opacity=50), де параметр opacity може приймати значення від 0 до 100.