Kurs języka HTML i CSS

Poradnik webmastera

  • Zwiększ rozmiar czcionki
  • Domyślny  rozmiar czcionki
  • Zmniejsz rozmiar czcionki
CSS3 - kolor

CSS3 - opacity

Email Drukuj PDF

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).

 

CSS. Tworzenie nowoczesnych stron WWW.

CSS3. Tworzenie nowoczesnych stron WWW
(czerwiec 2012)

HTML5 i CSS3. Standardy przyszłości

HTML5 i CSS3
Standardy przyszłości

CSS3. Szybki start. Wydanie V

CSS3. Szybki start.
Wydanie V