Kolory HTML | RGB, Hex, wyjaśnił HSL
Ten zapis pokaże, jak dodać kolory do elementu/dokumentu HTML. Zapewni ogólny przegląd podstawowych konwencji kolorów, takich jak „nazwy kolorów”, „wartości RGB”, „Wartości szesnastkowe” itp. A więc zacznijmy!
Nazwy kolorów HTML
Pierwszym sposobem wdrożenia kolorów HTML jest po prostu użycie nazwy kolorów I.mi. Angielskie słowa dla koloru, takie jak zielony, żółty, czerwony itp. HTML obsługuje ponad sto standardowych nazw kolorów.
Przykład
Załóżmy, że mamy akapit w naszym HTML:
Paragraf
Aby nadać mu kolor, powiedzmy zielony, możemy to zrobić:
Paragraf
HTML HEXADECIMAL Kolor
HTML obsługuje inny sposób dodawania kolorów i.mi. Wartości szesnastkowe. Wartości szesnastkowe można zapisać za pomocą szesnastu cyfr 0-9 i A-F. Jest to określone przez „#”Symbol, a następnie trzy lub sześć cyfr. Na przykład: #Rrggbb. Tutaj pierwsze dwa szczeliny reprezentują czerwone, sąsiednie dwa gniazda pokazują zielone, a ostatnie dwa show Blue Value.
Przykład
Załóżmy, że mamy akapit w naszym HTML:
Paragraf
Tym razem spróbujemy ustawić kolor tła
Tag do Gray za pomocą wartości sześciokadciowców i możemy to zrobić za pomocą następującego wiersza kodu HTML:
Paragraf
W powyższym kodzie „#e3e3e3” to kod szesego koloru szarego.
Wartości szesnastkowe można zapisać za pomocą zaledwie trzech cyfr zamiast sześciu cyfr. Na przykład wartość szesnastkowa #f00 Wytworzy ten sam kolor, co #FF0000.
Kolory HTML RGB
Inną najczęściej stosowaną metodą dla kolorów są wartości RGB. Wymaga trzech wartości i.mi. czerwony, zielony i niebieski. Zamiast używać dziwnych liczb szesnastkowych, właściwość RGB wykorzystuje liczby od 0 do 255. Liczby te określają na przykład intensywność każdego parametru koloru, aby wykorzystać czarny zestaw kolorów wszystkich parametrów na 0 i.mi. RGB (0, 0, 0). RGB (0, 0, 255) wyświetli niebieski kolor i tak dalej.
Przykład
Rozważmy ten sam akapit:
Paragraf
Teraz spróbujemy ustawić jego kolor tła na pomarańczowy za pomocą wartości RGB i możemy to zrobić za pomocą następującego kodu HTML:
Paragraf
W powyższym kodzie „RGB (255, 165, 0)” to wartości RGB dla koloru pomarańczowego.
HTML RGBA Kolory
Wartości RGBA są rozszerzeniem wartości kolorów RGB, gdzie „A”Reprezentuje kanał alfa, który określa krycie dla koloru. Parametr alfa to liczba między 0 (przezroczysty) a 1 (nieprzezroczysty).
Przykład
Ten przykład pokazuje, w jaki sposób parametr alfa „A”Zostanie określone:
Paragraf
Powyższy kod zaimplementował parametr alfa
element. Teraz wynik będzie zgodnie z ilością przezroczystości, jak pokazano w następującym wyjściu:
Kolory HTML HSL
HTML zapewnia kolejną konwencję kolorów i.E HSL określa kolor z odcieniem, nasyceniem i światłem. Opcjonalnie może mieć również parametr alfa.
- Termin odcień określa anioła w kolorze E Wheel E.G. 0 lub 360 stopni reprezentuje czerwony kolor, podobnie pozostałe kolory są rozdzielone wokół koła. Na przykład zielona jest równa 120 stopni, cyjan jest równy 180 stopni i tak dalej.
- Podczas gdy druga wartość w HSL to nasycenie, które określa intensywność koloru i jest reprezentowana przez % znak.
- Trzecią wartością jest lekkość, która określa poziomy lekkości reprezentowane przez znak %.
Na przykład sto procent oznacza pełne światło i.mi. biały, podczas gdy zero procent oznacza brak światła i.mi. czarny i tak dalej.
Przykład
Poniższy skrypt wdroży konwencję kolorów HSL na różnych elementach HTML:
Paragraf
Otrzymamy następujące dane wyjściowe dla powyższego kodu:
Wniosek
HTML zapewnia wiele kolorowych konwencji do ustawienia koloru tekstu, koloru tła itp. Istnieją cztery sposoby pokolorowania elementu HTML: nazwa koloru, wartości RGB, wartości szesnastkowe i wartości HSL. Aby ustawić kolor za pomocą „nazwy koloru”, określ nazwę koloru i.mi. czerwony zielony. W przypadku RGB połącz wartości kolorów czerwone, zielone i niebieskie od 0 do 255. Dla koloru sześciokadciowego napisz trzy lub sześciocyfrowy kod kolorów. W przypadku HSL ustaw wartości odcienia, nasycenia i światła.