opacity
Īpašums CSS norāda, cik pārredzama elements ir.
Pamata lietošana:
div ( opacity: 0.5; )
Dūmainībai noklusējuma sākotnējā vērtība ir 1 (100% necaurspīdīga). Dūmainība nav iedzimta, bet gan tāpēc, ka vecākiem ir necaurredzamība, kas attiecas uz visu tajā esošo. Jūs nevarat padarīt bērna elementu mazāk caurspīdīgu nekā vecāks, bez dažām viltībām. Vērtības ir skaitlis no 0 līdz 1, kas apzīmē kanāla necaurredzamību (“alfa” kanālu). Kad elementa vērtība ir 0, elements ir pilnīgi neredzams; vērtība 1 ir pilnīgi necaurspīdīga (cieta).
Pārbaudiet šo pildspalvu!
IE saderība
Ja vēlaties, lai necaurredzamība darbotos visās IE versijās, secībai jābūt šādai:
.opaque ( /* Theoretically for IE 8 & 9 (more valid) */ /*… but not required as filter works too */ /* should come BEFORE filter */ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; // IE8 /* This works in IE 8 & 9 too */ /*… but also 5, 6, 7 */ filter: alpha(opacity=50); // IE 5-7 /* Modern Browsers */ opacity: 0.5; )
Ja jūs neizmantojat šo pasūtījumu, IE8-as-IE7 nepiemēro necaurredzamību, lai gan IE8 un tīrs IE7 to dara.
Piezīme par sakraušanas kontekstiem
Ja tiek novietots elements ar opacity
vērtību, kas mazāka par 1, z-index
īpašums tiek lietots, kā aprakstīts CSS2.1, izņemot to, ka auto
vērtība tiek uzskatīta par 0, jo vienmēr tiek izveidots jauns sakraušanas konteksts.
Necaurredzamību var izmantot kā alternatīvu visibility
īpašumam: visibility: hidden;
ir tāpat kā opacity: 0;
.
Pārlūka atbalsts
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
24+ | 5.1+ | 19+ | 12.1+ | 9+ | 2.1+ | 3.2+ |