Jednym z narzędzi do zmiany stylów stron internetowych jest kolor CSS. Istnieje kilka sposobów na zmianę tego ustawienia. Każdy ma zarówno zalety, jak i wady.
Tytuł
Właściwość color określa kolor elementu. 145 tytułów CSS zostało zawartych w CSS. Wśród nich są proste (takie jak czarny, niebiesko) i kompleksu (np purpura, lawngreen).
Ponieważ cała lista jest pamiętana, nazwy w arkuszu stylów są rzadko używane.
RGB
Większość telewizorów, smartfonów i monitorów współpracuje z modelem kolorów RGB. Oznacza to, że każdy odcień można ustawić za pomocą kombinacji podstawowych kolorów, takich jak czerwony, zielony i niebieski. To podejście jest stosowane w urządzeniach, a także w CSS. Kolory są pierwsze wartości zespół trwać od 0 do 255. Liczba możliwych odcieniach nadal 16777216.
Ponieważ model RGB jest bezpośrednio związane z prawami fizycznymi Imaging kolor czarny jest podana jako rgb (000) biały - rgb (255255255). System RGBA jest całkowicie analogiczny do RGB, tylko z dodatkiem kanału alfa. Wpływa na przezroczystość, która łączy cień z płytą montażową. W takim przypadku wygląd elementu będzie się różnić w zależności od "podłoża".
HSL
Aby zrozumieć, jak działa system HLS, trzeba zapewnić koło kolorów. W jego centrum znajduje się czerwony, a następnie (zgodnie z ruchem wskazówek zegara) wszystkie inne odcienie tęczy. Aby określić kolory w CSS za pomocą HLS należy podać trzy parametry:
cień (w stopniach) - w kierunku środka okręgu;
Nasycenie (w procentach),ile potrzeba koloru;
jasność (w procentach).
Na przykład kolor fioletowy można zdefiniować w następujący sposób: hsl (315100%, 45%). HSL jest najwygodniejszy w eksperymentach. Ucząc się koła kolorów, można w przybliżeniu przedstawić kolor określonego elementu podczas przeglądania arkusza stylów. # Hsla-hsla - ten sam HLS, tylko z kanałem alfa: hsl (0100%, 5006) - czerwony, przezroczysty nieco ponad połowę.
HEX
W CSS, kolor można określić za pomocą reprezentacji heksadecymalnej, na przykład pomarańczowy jest ustawiony na # FF4500. Aby lepiej zrozumieć, czym jest reprezentacja szesnastkowa, głębiej rozważa się system dziesiętny. Zawiera cyfry od 0 do 9. Kiedy liczba jest wymagana, dodaje się kolejną do liczby, a następnie 10 oznacza 100 itd. W systemie heksadecymalnym wszystko jest dokładnie takie samo, ale po 9 zaczyna się A i B oraz F - taki sam jak 15 w systemie dziesiętnym. Następnie dodaje się jedną cyfrę, a wynik jest równy 16 w naszym zwykłym rachunku.
Podobnie jak w RGB, odcienie w HEX wskazują, które proporcje używają głównych kolorów. W tym przypadku nie są one oddzielone przecinkami (kolor: # FFD500). Każde dwa znaki określają liczbę czerwonych, zielonych i niebieskich. Z reguły system HEX nie jest używany podczas eksperymentów, ponieważ niemożliwe jest wybranie wymaganych kolorów CSS. Stół może pomóc w tym przypadku, ale jeśli ciągle się z nią kontaktujesz, praca będzie opóźniona. Reprezentacja heksadecymalna jest najwygodniejsza przy przenoszeniu szablonu z edytora graficznego. Dużo łatwiej kopiować tylko z niegojedna cyfra niż jedna po drugiej.
Jaki jest najlepszy sposób?
Nie ma nic konkretnego do powiedzenia na ten temat. Jeśli elementy interfejsu wymagają przezroczystości, wybierz między RGBA i # hsla-color hsla. Jeśli chcesz poeksperymentować w przeglądarce, najbardziej wygodne będzie koło kolorów HLS. Jeśli używasz palety lub przenosisz projekt Photoshopa, powinieneś preferować heksadecymalne kolory CSS.
