Jak sama nazwa mówi kolor tła właściwość określa kolor tła dowolnego elementu. Można go użyć do zmiany kolor tła jednego elementu, wielu elementów, całej strony lub całego dokumentu.

W CSS różne wartości można przypisać do kolor tła właściwość jako wymieniona poniżej:

• Nazwa koloru i.mi. czerwony, żółty, zielony itp.,
• Wartości kolorów szesnastkowych.mi. #FF0000, 00FF00 itp.
• Wartość RGB, taka jak RGB (255, 0, 0) itp.
• Wartości HSL, takie jak (55, 45, 55) itp.

Ten zapis przedstawi ogólny przegląd właściwości koloru tła. Omówi się, jak przypisać różne wartości do właściwości koloru tła.

Jak ustawić kolor tła za pomocą nazw kolorów

W CSS możemy ustawić kolor tła za pomocą nazw kolorów, takich jak czerwony, zielony, niebieski itp.

Przykład 1: Poniższy przykład ustawia kolor tła dla całej strony za pomocą „Wartość nazwy koloru”:

Witamy w Linuxhint.com

Przykładowy akapit

Powyższy fragment określa kolor tła za pomocą wewnętrznego CSS. Wyświetli następujące dane wyjściowe:

Jak ustawić kolor tła za pomocą szesnastkowego kodu kolorów

W CSS kolor tła można przypisać przy użyciu heksadecimalnych wartości kolorów. Wartość koloru szesnastkowego składa się z „#” symbol, a następnie trzy lub sześć cyfr kod.

Przykład 2: Poniższy fragment uwzględnia kod koloru szesnastkowego do stylizowania koloru tła tagów akapitowych za pomocą wewnętrznego stylu i koloru tła

Korzystanie z inline CSS:

kolor tła za pomocą kodu kolorów sześciokątnych

Witamy w Linuxhint.com

Witamy w Linuxhint.com

W rezultacie wytwarza następujące dane wyjściowe:

Jak ustawić kolor tła za pomocą kodu kolorów RGB

Kody kolorów RGB można użyć do ustawienia koloru tła elementu. Kod koloru RGB określa kolor przy użyciu wartości liczbowych wynosi od 0 do 255. Kolor RGB wykorzystuje trzy główne kolory i.mi. (czerwony, zielony i niebieski) w celu wygenerowania różnych kombinacji kolorów.

Przykład 3: Poniższy przykład utworzy zewnętrzny plik CSS, aby ustawić kolor tła różnych elementów. Wykorzystuje kody kolorów RGB do zastosowania koloru tła.

Plik CSS:

ciało
kolor tła: RGB (212, 212, 212);

H1
kolor tła: RGB (0, 144, 158);

P
kolor tła: RGB (137, 210, 236);

Plik HTML:

kolor tła za pomocą kodu kolorów RGB

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Powyższy kod wygeneruje następujący wynik:

Jak ustawić kolor tła za pomocą kodu kolorów RGBA

Dodatkowy parametr alfa (a) można dodać do kodu kolorów RGB, który określa krycie koloru. Wartość parametru alfa leży między 0.0 do 1.0.

Przykład 4: Poniższy podany kod nieco rozszerzył poprzedni przykład i dodał również wartość dla parametru alfa:

Plik CSS:

ciało
kolor tła: RGBA (212, 212, 212, 0.1);

H1
kolor tła: RGBA (0, 144, 158, 0.1);

P
kolor tła: RGBA (137, 210, 236, 0.1);

Plik HTML:

kolor tła za pomocą kodu kolorów RGB

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Jedyną zmianą w poprzednim przykładu (RGB) i tym (RGBA) jest parametr alfa. Porównaj oba wyjścia, które zauważysz wyraźną różnicę:

Tak działał parametr alfa.

Jak ustawić kolor tła za pomocą kodu kolorów HSL

CSS obsługuje kolejną kolorową konwencję o nazwie HSL. HSL ustawia kolor w odniesieniu do odcienia, nasycenia i lekkości.

Przykład 5: Rozważ następujący kod, który określa, jak działa konwencja HSL:

kolor tła za pomocą kodu kolorów HSL

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Powyższy kod zaimplementował kolor tła

I

element za pomocą konwencji kolorów HSL. Wyświetli następujące dane wyjściowe:

Jak ustawić kolor tła za pomocą kodu kolorów HSLA

Parametr alfa można wykorzystać z konwencją kolorów HSL, aby określić krycie koloru.

Przykład 6: Rozszerzmy powyższy kod nieco bardziej i dodajmy parametr alfa w HSL:

kolor tła za pomocą kodu kolorów HSLA

Witamy w Linuxhint.com

Witamy w Linuxhint.com

Wyjście udowodni, że parametr alfa dodał krycie do koloru tła, jak pokazano poniżej:

Wniosek

CSS wykorzystał właściwość tła do wdrożenia koloru tła na elemencie, stronie itp. Kolor tła można przypisać za pomocą wielu sposobów, takich jak określenie nazwy koloru, wartości szesnastkowej, wartości RGB itp.

W tym zapisie uwzględniono wiele konwencji kolorowych dla właściwości koloru tła. Zapewnia szczegółowy przewodnik na temat zastosowania koloru tła za pomocą „nazwy kolorów”, „wartości szesnastkowych”, „kodów kolorów RGB, RGBA” i „HSL, kody kolorów HSLA”.