kurssijärjestelmä

CSS viittauskirja

CSS 属性

Valinnainen kurssi

Kurssisuositus:

CodeW3C.com kikkakori

CSS oklch()-funktio

Edellinen sivu CSS oklab() funktio
Seuraava sivu CSS opacity() funktio
Takaisin ylös CSS funktioviittauskirja

Määrittely ja käyttö

CSS:ssä oklch() Funktiot määrittelevät värit OKLCH-värimaailmassa.

oklch() Funktiot ovat erittäin intuitiivisia: sinun täytyy harkita käytettävänä olevan valoisuuden (L) määrää, sävy (harmaa) voimakkuutta (C), sekä väri itse (H). Lisäksi voit valita lisätä läpinäkyvyyskanavan arvon (A), joka ilmaisee väriä olevan peittävyyden.

Esimerkkejä

Määritä erilaisia oklch() Väri:

/* Erilaisia valoisuusasteen vihreitä /
#p1 {taustaväri: oklch(30% 0.4 150);}
#p2 {taustaväri: oklch(60% 0.4 150);}
#p3 {taustaväri: oklch(100% 0.4 150);}
/ eri kirkkauden keltainen /
#p4 {background-color: oklch(30% 0.4 100);}
#p5 {background-color: oklch(60% 0.4 100);}
#p6 {background-color: oklch(100% 0.4 100);}
/ eri kirkkauden punainen */
#p7 {background-color: oklch(30% 0.4 20);}
#p8 {background-color: oklch(60% 0.4 20);}
#p9 {background-color: oklch(100% 0.4 20);}

Kokeile itse

CSS syntaksi

absoluuttinen arvo syntaksi

oklch(L C H / A)

arvo	kuvaus
L	Vakio. Määrittelee väriä koskevan havaittavan kirkkauden, joka voi olla 0-1 välillä oleva numero tai 0-100 välillä oleva prosentti. 0 (tai 0%) tarkoittaa mustaa, 1 (tai 100%) tarkoittaa valkoista. Vaihtoehtoinen. Yhtä kuin 0%.
C	Vakio. Määrittelee väriä koskevan sävyn (väriä koskevan määrän), joka voi olla numero tai prosentti. Täytyy olla -0.4 ja 0.4 välillä oleva numero tai -100% ja 100% välillä oleva prosentti. Pienin arvo (0% tai -0.4) tekee väristä lähempää harmaata. Vaihtoehtoinen. Yhtä kuin 0%.
H	Vakio. Määrittelee väriä, joka voi olla numero tai aste (0-360). Vaihtoehtoinen. Yhtä kuin 0deg.
/ A	Valinnainen. Ilmaisee väriä koskevan läpinäkyvyyden kanavan arvon (0% tai 0% on täysin läpinäkyvä, 100% tai 100% on täysin läpinäkyvä). Vaihtoehtoinen. Ilmaisee läpinäkyvyyden kanavan olevan tyhjän (0% on tyhjä). Oletusarvo on 100%.

suhteellinen arvo syntaksi

oklch(from color L C H / A)

arvo	kuvaus
from color	Aloitetaan avainsanalla from, jonka jälkeen seuraa alkuperäisen väriä koskeva arvo. Tämä on suhteellisten värien pohjana oleva alkuperäinen väri.
L	Vakio. Määrittelee väriä koskevan havaittavan kirkkauden, joka voi olla 0-1 välillä oleva numero tai 0-100 välillä oleva prosentti. 0 (tai 0%) tarkoittaa mustaa, 1 (tai 100%) tarkoittaa valkoista. Vaihtoehtoinen. Yhtä kuin 0%.
C	Vakio. Määrittelee väriä koskevan sävyn (väriä koskevan määrän), joka voi olla numero tai prosentti. Täytyy olla -0.4 ja 0.4 välillä oleva numero tai -100% ja 100% välillä oleva prosentti. Pienin arvo (0% tai -0.4) tekee väristä lähempää harmaata. Vaihtoehtoinen. Yhtä kuin 0%.
H	Vakio. Määrittelee väriä, joka voi olla numero tai aste (0-360). Vaihtoehtoinen. Yhtä kuin 0deg.
/ A	Valinnainen. Ilmaisee väriä koskevan läpinäkyvyyden kanavan arvon (0% tai 0% on täysin läpinäkyvä, 100% tai 100% on täysin läpinäkyvä). Vaihtoehtoinen. Ilmaisee väriä koskevan läpinäkyvyyden kanavan arvon (0% tai 0% on täysin läpinäkyvä, 100% tai 100% on täysin läpinäkyvä). Oletusarvo on 100%.