CSS3 - kolor

CSS3 - opacity

czwartek, 17 luty 2011 08:43 pwimmer
Drukuj

Tematy: color-profile | opacity | rendering-intent

Dane w pigułce
Zastosowanie Określa nieprzezroczystość (krycie) elementu
Dziedziczenie nie
Wartości liczba w przedziale [0-1]
Wartość domyślna 1
Przykład opacity: 0.5
Składnia JavaScript object.style.opacity=0.5

Aby zdefiniować nieprzezroczystość, należy wpisać w definicji stylu opacity: wartość

Internet Explorer nie obsługuje stylu w klasycznej postaci, lecz wykorzystuje metodę filter:Alpha(opacity=50);.

Polecenie opacity służy do obracania ustalania stopnia nieprzezroczystości (zaczernienia) obiektu. Im wyższa wartość w przedziale [0-1], tym bardziej nieprzezroczysty jest obiekt, im niższa - tym bardziej przezroczysty (transparentny).

Przykłady:

<img src="/plik.jpg" style="opacity:0.3">

Czerwone tło bez zmiany nieprzezroczystości:

Czerwone tło z nieprzezroczystością 0.5:

Obrazek bez nieprzezroczystości:

strawberry

Obrazek z nieprzezroczystością 0.3;

strawberry

Tekst o różnym stopniu nieprzezroczystości: 1, 0.75, 0.50 i 0.25.

Tekst o pełnej nieprzezroczystości

Tekst o nieprzezroczystości 0.75

Tekst o nieprzezroczystości 0.50

Tekst o nieprzezroczystości 0.25


Interpretacja: Firefox, Chrome, Opera, Internet Explorer (metoda alternatywna).