Opacity: Skillnad mellan sidversioner
Från Webbling
PGJ (diskussion | bidrag) |
PGJ (diskussion | bidrag) |
||
| Rad 7: | Rad 7: | ||
<codepen pen="ZGdabE" height="200" tab="css"> | <codepen pen="ZGdabE" height="200" tab="css"> | ||
</codepen> | </codepen> | ||
Lägg märke till att ''allt'' innehåll i elementet, inklusive alla underelement, får samma genomskinlighet. Vill man | Lägg märke till att ''allt'' innehåll i elementet, inklusive alla underelement, får samma genomskinlighet. Vill man t.ex. ha enbart bakgrunden halvgenomskinlig (men inte övrigt innehåll) är det antagligen bättre att använda sig av <code>[[background-color]]</code> och sätta en bakgrundsfärg med ett alfavärde. Se [[färger]] för mer information om detta. | ||
== Egenskapens definition i CSS Color Module Level 3 == | == Egenskapens definition i CSS Color Module Level 3 == | ||
http://www.w3.org/TR/css3-color/#transparency | http://www.w3.org/TR/css3-color/#transparency | ||
Versionen från 20 augusti 2015 kl. 20.09
opacity används för att ange hur genomskinligt ett element ska vara. Som parameter anges ett alfavärde, dvs hur genomskinligt elementets innehåll ska vara. Värdet kan vara ifrån 0.0 till 1.0, där noll är helt genomskinlig (dvs, elementet blir osynligt) och ett inte är helt ogenomskinlig.
Defaultvärdet är 1, dvs ogenomskinlig.
Exempel
Här gör vi ett element halvgenomskinligt.
Lägg märke till att allt innehåll i elementet, inklusive alla underelement, får samma genomskinlighet. Vill man t.ex. ha enbart bakgrunden halvgenomskinlig (men inte övrigt innehåll) är det antagligen bättre att använda sig av background-color och sätta en bakgrundsfärg med ett alfavärde. Se färger för mer information om detta.