CSS hsla() -funktio

Esimerkki

Määritä erilaisia HSL-värejä, joilla on läpinäkyvyys:

#p1 {background-color:hsla(120,100%,50%,0.3);} /* Vihreä */
#p2 {background-color:hsla(120,100%,75%,0.3);} /* Kevyt vihreä */
#p3 {background-color:hsla(120,100%,25%,0.3);} /* Syvä vihreä */
#p4 {background-color:hsla(120,60%,70%,0.3);} /* Pehmeä vihreä */

Kokeile itse

Määrittely ja käyttö

hsla() -funktio käyttää Hue-saturation-lightness-alpha -mallia (HSLA) värien määrittämiseen.

HSLA-väriarvo on HSL-väriarvon laajennus, joka sisältää Alpha-kanavan - tämä kanava määrittää väriädyöksellisyyden.

Versio: CSS3

Selaimen tuki

Taulukossa olevat numerot mainitsevat ensimmäisen selaimen, joka täysin tukee toimintoa.

funktio
hsla() 1.0 9.0 3.0 3.1 10.0

CSS syntaksi

hsla(väriaste, sävy, kevytvarjous, alpha)
arvo kuvaus
väriaste Määritä väripyörän asteet (0:sta 360:een) - 0 (tai 360) on punainen, 120 vihreä, 240 sininen.
sävy Määritä sävy - 0% on harmaa, ja 100% on täysin värikäs (täysin saturaatio).
kevytvarjous Määritä kirkkaus - 0% on musta, 50% on normaali ja 100% on valkoinen.
alpha Määritä läpinäkyvyys, numero välillä 0.0 (täysin läpinäkyvä) ja 1.0 (täysin läpinäkyvä).