Wszystkie nowoczesne przeglądarki internetowe obsługują różne kolory, aby utrzymać kolorowy wyświetlacz. W CSS kolory można reprezentować na kilka sposobów, nawet przy użyciu nazwy kolorów, takiej jak „kolor niebieski". Jednak ta metoda obsługuje tylko określone nazwy kolorów. Dlatego w CSS inne zaawansowane metody są używane do wyświetlania kolorów, takich jak RGB, HSL, Hex itp.

W tym artykule omówiono trzy metody reprezentacji kolorów: RGB, RGBA i Hex. W CSS, RGB () to wbudowana funkcja, RGBA jest również formatem kolorów wyświetlacza z rozszerzeniem alfa. Ponadto dostarczanie wartości kolorów w liczbach sześciokątnych jest również szeroko stosowane w CSS.

Funkcja rgb () w CSS

RGB to połączenie trzech kolorów (czerwony, zielony i niebieski), który jest używany we wszystkich systemach komputerowych do kolorowego wyświetlacza. Jak wiemy, są to podstawowe kolory i łącząc je, możemy uzyskać dowolny kolor, który jest widoczny w spektrum kolorów.

W CSS kolory te są zdefiniowane w postaci funkcji RGB (): (czerwony, zielony, niebieski). Zakres wszystkich tych kolorów jest zdefiniowany od 0 do 255 określa intensywność koloru i możemy zmienić kolory, zmieniając te wartości. Intensywność tych kolorów jest dobrze zdefiniowana w danym przykładzie.

Przykład

RGB (0, 255, 0)

Ta kombinacja zwraca zielony kolor, ponieważ ma najwyższą intensywność, a pozostałe dwa kolory mają 0 intensywności.

Zmieniając intensywności wszystkich trzech kolorów, otrzymujemy różne kolory, takie jak

• RGB (255, 255, 255) wyświetla biały kolor
• i RGB (0, 0, 0) daje czarny kolor.

Dalsze przykłady kolorów pokazano w danym przykładzie

Przykład

RGB (0, 255, 0)

RGB (60, 60, 60)

RGB (138, 238, 130)

RGB (255, 255, 255)

Kolory RGBA

W CSS RGBA jest również formatem do wyświetlania kolorów z rozszerzeniem alfa. Struktura tej funkcji kolorów podano poniżej.

RGBA (czerwony, zielony, niebieski, alfa)

W tej funkcji alfa służy do wyrażenia krycia koloru. W właściwości CSS krycia służy do ustawienia przezroczystości koloru, a jego zakres leży między 0.0 do 1.0, gdzie 0.0 reprezentuje w pełni przezroczyste i 1.0 reprezentuje w pełni nieprzezroczyste. Lepiej zrozumiesz z danego przykładu.

Przykład

Zielony

Zielony

Zielony

Zielony

Zielony

W powyższym przykładzie ustawiamy wartość alfa od 0.0 (w pełni przezroczysty) do 1.0 (w pełni nieprzezroczyste) i możesz zobaczyć różnicę intensywności przezroczystości.

Kolory sześciokątne CSS

W kolorach CSS można również określić w wartościach szesnastkowych, to tylko kolejny sposób na reprezentowanie kolorów. W CSS jest to najczęstszy sposób określania koloru za pomocą wartości szesnastkowych z znakiem „ #”, takim jak #RRGGBB. Podczas gdy R, G, B są kodami odpowiednio dla czerwonego, zielonego i niebieskiego.

Liczby szesnastkowe z kombinacją 0-9 i A-F są używane do reprezentowania koloru w CSS. Niektóre przykłady podstawowych kolorów sześciokątnych podano poniżej:

• #ffffff: reprezentuje biały kolor i
• #000000: Reprezentuje czarny kolor.

Dla lepszego zrozumienia, zapoznaj się z poniższym przykładem.

Przykład

Określ kolory za pomocą wartości sześciokątnych

#0f4bff

#3CB371

EE652E

#FFA500

#6a5acd

W powyższym przykładzie wyświetlane są różne kolory za pomocą wartości sześciokątnych. Wszystkie te wartości sześciokątne są kombinacją liczb sześciokadciowców, które są 16 odrębnych wartości alfa-numerycznych, które leżą między 0-9 a A-F.

Wniosek

RGB, RGBA i HEX to różne typy do wyświetlania kolorów w CSS. Podczas gdy RGB jest kombinacją trzech kolorów (czerwony, zielony i niebieski), RGBA jest taka sama jak RGB z rozszerzeniem alfa (alpha = transporcja transportowa), a Hex używa wartości szesnastkowych do reprezentowania kolorów kolorów. Zakres kolorów RGB i sześciokątnych leży odpowiednio od 0 do 255 liczb całkowitych do 00 do FF. Wszystkie te trzy typy są dobrze zdefiniowane z przykładami.