Funkcija opacity
Funkcija opacity omogućava
promenu providnosti pozadinske slike.
Vrednost 100% ili 1 ostavlja
slici originalnu providnost.
Vrednost 0 označava
da će slika postati potpuno providna.
Bilo koji broj koji se nalazi u
ovom opsegu postavlja delimičnu providnost pozadine.
Negativna vrednost se ne može postaviti.
Podrazumevana vrednost je 1.
Sintaksa
selektor {
filter: opacity(broj);
}
Primer
Hajde da postavimo providnost našoj slici na
50%:
<div id="elem"></div>
#elem {
filter: opacity(50%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Primer
A sada hajde da postavimo providnost na
100%:
<div id="elem"></div>
#elem {
filter: opacity(100%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Primer
A sada hajde da zadamo u
funkciji opacity vrednost
jednaku 0:
<div id="elem"></div>
#elem {
filter: opacity(0);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Pogledajte takođe
-
funkcija
blur,
koja zamućuje pozadinu -
funkcija
brightness,
koja zadaje svetlinu pozadini -
funkcija
contrast,
koja zadaje kontrastnost pozadini -
funkcija
drop-shadow,
koja zadaje senku pozadini -
funkcija
hue-rotate,
koja zadaje nijansu boje pozadini -
funkcija
invert,
koja invertuje boje pozadine -
funkcija
sepia,
koja pretvara pozadinu u sepiju -
svojstvo
background,
koje predstavlja svojstvo-skraćenicu za pozadinu -
svojstvo
background-image,
pomoću kojeg se bloku može zadati pozadinska slika