Προτεινόμενο μάθημα:

CSS lab() συνάρτηση

Ορισμός και χρήση του lab() η συνάρτηση σε CIE Lab χρωματικό χώρο καθορίζει το χρώμα. Ο χώρος αυτός εκφράζει όλες τις ορατές χρώσεις του ανθρώπινου οφθαλμού.

παραδείγματα

ορισμός διαφορετικών lab() χρώμα:

#p1 {background-color:lab(0 40% 20% / 0.5);}
#p2 {background-color:lab(30 -40% -20%);}
#p3 {background-color:lab(40 30% -20% / 20%);}
#p4 {background-color:lab(50 60% 20%);}
#p5 {background-color:lab(60 50% -10%);}
#p6 {background-color:lab(70 70% -80% / 0.3);}
#p7 {background-color:lab(80 70% 20% / 0.5);}
#p8 {background-color:lab(90 80% -20%);}
#p9 {background-color:lab(100 90% -100%);}

Προσπάθησε να το δοκιμάσεις

Γλώσσα CSS

Γλώσσα αβсолютτικής τιμής

lab(L a b / A)
Τιμή Περιγραφή
L

Απαιτείται. Προσδιορίζει τη λαμπρότητα του χρώματος, μπορεί να είναι αριθμός από 0 έως 100 ή ποσοστό.

0 (ή 0%) σημαίνει μαύρο, 100 (ή 100%) σημαίνει λευκό.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
a

Απαιτείται. Προσδιορίζει αριθμό από -125 έως 125 ή ποσοστό από -100% έως 100%.

Δημιουργεί τη απόσταση του χρώματος κατά μήκος του άξονα a, δείχνοντας το βαθμό κόκκινου-πράσινου του χρώματος. -125 σημαίνει πράσινο, 125 σημαίνει κόκκινο.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
b

Απαιτείται. Προσδιορίζει αριθμό από -125 έως 125 ή ποσοστό από -100% έως 100%.

Δημιουργεί τη απόσταση του χρώματος κατά μήκος του άξονα b, δείχνοντας το βαθμό κίτρινου-μπλε του χρώματος.

-125 σημαίνει μπλε, 125 σημαίνει κίτρινο.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
/ A

Επιλογή. Προσδιορίζει την αξία του διαφανείου χρώματος του χρώματος (0% ή 0 για πλήρως διαφανές, 100% ή 100 για πλήρως αδιαφανές).

Μπορεί επίσης να χρησιμοποιηθεί το none (προσωρινώς αδιαφανές).

Η προεπιλεγμένη τιμή είναι 100%.

Γλώσσα σχετικής τιμής

lab(from color L a b / A)
Τιμή Περιγραφή
from color

Ξεκινά με το κλειδί from, ακολουθούμενο από την τιμή χρώματος που εκφράζει το αρχικό χρώμα.

Αυτό είναι το αρχικό χρώμα που βασίζεται στο σχετικό χρώμα.
L

Απαιτείται. Προσδιορίζει τη λαμπρότητα του χρώματος, μπορεί να είναι αριθμός από 0 έως 100 ή ποσοστό.

0 (ή 0%) σημαίνει μαύρο, 100 (ή 100%) σημαίνει λευκό.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
a

Απαιτείται. Προσδιορίζει αριθμό από -125 έως 125 ή ποσοστό από -100% έως 100%.

Δημιουργεί τη απόσταση του χρώματος κατά μήκος του άξονα a, δείχνοντας το βαθμό κόκκινου-πράσινου του χρώματος.

-125 σημαίνει πράσινο, 125 σημαίνει κόκκινο.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
b

Απαιτείται. Προσδιορίζει αριθμό από -125 έως 125 ή ποσοστό από -100% έως 100%.

Δημιουργεί τη απόσταση του χρώματος κατά μήκος του άξονα b, δείχνοντας το βαθμό κίτρινου-μπλε του χρώματος.

-125 σημαίνει μπλε, 125 σημαίνει κίτρινο.

Μπορεί επίσης να χρησιμοποιηθεί το none ( ίσο με 0%).
/ A

Επιλογή. Προσδιορίζει την αξία του διαφανείου χρώματος του χρώματος (0% ή 0 για πλήρως διαφανές, 100% ή 100 για πλήρως αδιαφανές).

Μπορεί επίσης να χρησιμοποιηθεί το none (προσωρινώς αδιαφανές).

Η προεπιλεγμένη τιμή είναι 100%.

Τεχνικά λεπτομέρειες

Έκδοση: CSS Color Module Level 4

Υποστήριξη του προγράμματος περιήγησης

Τα αριθμάς στις τάβλες αντιπροσωπεύουν την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως τη λειτουργία.

Chrome Edge Firefox Safari Opera
lab()
111 111 113 15 97
Συμμάixa αριθμών και ποσοστιαίων στοιχείων στα παραμέτρους
116 116 113 16.2 102

σχετικές σελίδες

Αναφορά:Χρώματα CSS

Αναφορά:CSS hsl() λειτουργία

Αναφορά:CSS hwb() συνάρτηση

Αναφορά:CSS lch() συνάρτηση

Αναφορά:CSS oklab() συνάρτηση

Αναφορά:CSS oklch() συνάρτηση