CSS hsla()-funksjonen

Eksempel

Definer forskjellige HSL-farger med uigjennomskinnelighet:

#p1 {background-color:hsla(120,100%,50%,0.3);} /* Grønlig */
#p2 {background-color:hsla(120,100%,75%,0.3);} /* Lys grønlig */
#p3 {background-color:hsla(120,100%,25%,0.3);} /* Mørk grønlig */
#p4 {background-color:hsla(120,60%,70%,0.3);} /* Blød grønlig */

Prøv det selv

Definisjon og bruk

hsla()-funksjonen bruker modellen Hue-saturation-lysstyrke-alpha (HSLA) for å definere farger.

HSLA-fargeverdien er en utvidelse av HSL-fargeverdien, med en alpha-kanal - denne kanalen angir fargeens uigjennomskinnelighet.

Versjon: CSS3

Nettleserstøtte

Tallene i tabellen angiver den første nettleser som fullt ut støtter funksjonen.

funktion
hsla() 1.0 9.0 3.0 3.1 10.0

CSS-syntaks

hsla(nuance, farvetone, lysstyrke, alpha)
værdi beskrivelse
nuance Definerer grader på farvetringen (fra 0 til 360) - 0 (eller 360) er rød, 120 er grøn, 240 er blå.
farvetone Definerer farvetone - 0% er gråtone, mens 100% er fuldfarvet (fuldt oplyst).
lysstyrke Definerer lysstyrke - 0% er sort, 50% er normal, 100% er hvid.
alpha Definerer uigennemskinnelighed som et tal mellem 0.0 (fuldstændig gennemsigtig) og 1.0 (fuldstændig uigennemskinnelig).