funkcja rgb() w CSS

definicja i użycie

CSS rgb() funkcji, używając modelu kolorów czerwony-zielony-niebieski (RGB). Można również dodać opcjonalny kanał przezroczystości (oznaczający przezroczystość koloru).

Wartości kolorów RGB określają się za pomocą rgb(czerwony zielony niebieski) Zdefiniowane. Każdy parametr definiuje intensywność koloru, może to być liczba całkowita z zakresu 0 do 255 lub wartość procentowa z zakresu 0% do 100%.

Na przykład, wartość rgb(0 0 255) prezentuje się jako niebieski, ponieważ parametr niebieski ustawiony jest na maksymalną wartość (255), podczas gdy inne parametry są ustawione na 0.

Uwaga:rgba() Funkcja jest rgb() Alternatywne nazwy funkcji. Zaleca się używanie rgb() Funkcja.

Przykład

Zdefiniuj różne kolory RGB(A):

#p1 {background-color:rgb(255 0 0);} /* Czerwony */
#p2 {background-color:rgb(0 255 0);} /* Zielony */
#p3 {background-color:rgb(0 0 255);} /* Niebieski */
#p4 {background-color:rgb(192 192 192);} /* Szary */
#p5 {background-color:rgb(255 255 0);} /* Żółty */
#p6 {background-color:rgb(255 0 255);} /* Czerwony */
#p7 {background-color:rgb(255 0 255 / 0.2);} /* Nieprzezroczysty czerwony */
#p8 {background-color:rgb(0 0 255 / 50%);} /* Nieprzezroczysty niebieski */

Spróbuj sam!

Syntaktyka CSS

Syntaktyka wartości absolutnych

rgb(R G B / A)
Wartość Opis
R

Wymagane. Definiuje intensywność czerwonego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
G

Wymagane. Definiuje intensywność zielonego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
B

Wymagane. Definiuje intensywność niebieskiego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
/ A

Opcjonalne. Oznacza wartość kanału przezroczystości koloru, 0% (lub 0) oznacza całkowitą przezroczystość, 100% (lub 1) oznacza całkowitą nieprzezroczystość.

Można również użyć none (oznaczającego brak kanału przezroczystości). Domyślną wartością jest 100%.

Syntaktyka wartości względnych

rgb(from color R G B / A)
Wartość Opis
from color

Zaczyna się od słowa kluczowego from, po którym następuje wartość koloru oryginalnego.

To jest oryginalny kolor, na którym opiera się względny kolor.
R

Wymagane. Definiuje intensywność czerwonego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
G

Wymagane. Definiuje intensywność zielonego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
B

Wymagane. Definiuje intensywność niebieskiego, może być całkowitą liczbą z zakresu 0 do 255 lub procentem z zakresu 0% do 100%.

Można również użyć none (equivalent do 0%).
/ A

Opcjonalne. Oznacza wartość kanału przezroczystości koloru, 0% (lub 0) oznacza całkowitą przezroczystość, 100% (lub 1) oznacza całkowitą nieprzezroczystość.

Można również użyć none (oznaczającego brak kanału przezroczystości). Domyślną wartością jest 100%.

Szczegóły techniczne

Wersja: CSS2

Obsługa przeglądarek

Liczby w tabeli oznaczają pierwszą wersję przeglądarki, która w pełni obsługuje tę funkcję.

Chrome Edge Firefox Safari Opera
rgb()
1 4 1 1 3.5
rgb() z parametrem przezroczystości
65 79 52 12.1 52
Parametry oddzielone spacjami
65 79 52 12.1 52