Hvordan man applicerer opacitet / gennemsigtighed i CSS3 - dummies

Opacitet eller gennemsigtighed er en ny effekt i CSS3. Designere er virkelig i de tidlige stadier af at eksperimentere med denne effekt. I CSS3 defineres gennemsigtighed ved at tildele en værdi til egenskaben for opacitet . En fuldstændig uigennemtrængelig genstand forhindrer helt, hvad der står bag det; objekter, der ikke er helt uigennemsigtige, er delvis gennemsigtige eller gennemsigtige.

Definerer halvtransparente baggrunde til sidelayoutelementer med CSS3 præsenterer nogle spændende muligheder for webdesignere. Semitransparente baggrunde bruges ofte, for eksempel i drop-down lister. Der har rullemenuelementerne. 5 opacitet er tildelt (de er 50 procent gennemsigtige). Som følge heraf forbliver det underliggende sideindhold synligt, når en menu falder ned.

Egenskaben for opacitet er defineret med en værdi fra 0 (helt usynlig) til 1 (fuldt uigennemsigtig; ikke gennemsigtig overhovedet). Så for eksempel en opacitet værdi af. 8 gør et objekt 80 procent uigennemsigtigt og så videre.

Egenskaben for opacitet kræver ikke præfikser for forskellige browsere. Syntaxen er enkel:

opacitet:. x

Den viste rulleliste er for eksempel defineret som sådan:

. menu_box {baggrundsfarve: # 999; polstring: 2px; farve: # 333333; Gennemsigtighed:. 5;}