999999 html kolor. Kolor w stylach można ustawić na różne sposoby: według wartości szesnastkowej, według nazwy, w formacie RGB, RGBA, HSL, HSLA
>>Zarządzanie kolorami
Szesnastkowe wartości kolorów RGB
Metody opisywania i przetwarzania kolorów różnią się między sobą tym, do jakiej ostatecznej reprezentacji są przeznaczone. Porównajmy na przykład reprezentacje kolorów dla poligrafii i dla monitorów komputerowych. W pierwszym przypadku podstawą jest biały kolor papieru, na który następnie nakładane są trzy kolory podstawowe: niebieski, fioletowy oraz żółty. Mieszając się ze sobą i z białym kolorem papieru w różnych proporcjach, te trzy kolory podstawowe dają różne odcienie kolorów, z wyjątkiem czystej czerni lub w przypadku braku kolorów, które dają biały kolor papier. Jeśli dodamy do nich czerń, otrzymamy CMYK- sposób na przekazanie koloru, gdy pożądany kolor zostanie uzyskany poprzez odjęcie brakujących kolorów od bieli.
W drugim przypadku podstawą jest czarny kolor ekranu monitora, którego każda komórka świeci w jednym z trzech kolorów: czerwony-czerwony, Zielony-zielony i niebieski-niebieski. Następnie, przy całkowitym braku jakiejkolwiek poświaty, otrzymujemy czysto czarny kolor ekranu, a dowolny z wymaganych kolorów jest podawany przez stosunek każdego z trzech kolorów. W takim przypadku dostaniemy RGB- Metoda transferu kolorów. Kolory podstawowe mogą mieć znaczenie od 0
zanim 255
, lub z 0%
zanim 100%
lub może być reprezentowana jako wartość szesnastkowa. Na poniższym rysunku widać wyniki mieszania kolorów podstawowych.
Szesnastkowy system liczbowy, w przeciwieństwie do dziesiętnego systemu liczbowego, nie składa się z dziesięciu cyfr, lecz szesnaście - stąd nazwa. W związku z tym nie powtarzające się warianty kombinacji dwóch cyfr mogą być tylko - 256 , aby kontynuować ciąg cyfr po 9 litery od A zanim F, więc rząd będzie wyglądał tak -
0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. |
W tym przypadku kolor jest określony przez trzy liczby szesnastkowe, z których każda składa się z dwóch cyfr. Pierwsza liczba określa intensywność czerwony kolory, średnia Zielony, Ostatnia rzecz- niebieski zabarwienie. Wszystkie liczby mogą przyjmować wartości z zakresu 00 zanim FF(od 0 do 255). Na przykład: zielony kolor podane jako #00FF00, czerwony - jak #FF0000, niebieski - jak #0000FF, biały - jak #FFFFFF, całkowity brak koloru lub czerni podano jako #000000 .
W poniższym formularzu możesz ustawić dowolne wartości szesnastkowe dla każdego z trzech kolorów i zobaczyć wynik ich mieszania klikając w polu wyjściowym.
Przykłady niektórych szesnastkowych wartości kolorów RGB: gradacje czerwonego, niebieskiego i zielonego.
pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod |
#010000 | #800000 | #000100 | #008000 | #000001 | #000080 | ||||||
#100000 | #900000 | #001000 | #009000 | #000010 | #000090 | ||||||
#200000 | #A00000 | #002000 | #00A000 | #000020 | #0000A0 | ||||||
#300000 | #B00000 | #003000 | #00B000 | #000030 | #0000B0 | ||||||
#400000 | #C00000 | #004000 | #00C000 | #000040 | #0000C0 | ||||||
#500000 | #D00000 | #005000 | #00D000 | #000050 | #0000D0 | ||||||
#600000 | #E00000 | #006000 | #00E000 | #000060 | #0000E0 | ||||||
#700000 | #FF0000 | #007000 | #00FF00 | #000070 | #0000FF |
Określanie koloru za pomocą literałów ciągu
Dla ułatwienia niektórym kolorom i ich kombinacjom nadano nazwy rozpoznawalne przez wszystkie przeglądarki i stało się możliwe ustawienie wielu z nich po nazwie. Poniższa tabela przedstawia niektóre nazwy kolorów:
pogląd | nazwać | pogląd | nazwać | pogląd | nazwać | pogląd | nazwać |
Biały | Czerwony | Pomarańczowy | Żółty | ||||
Zielony | Niebieski | Fioletowy | Czarny | ||||
Alicja niebieski | antyczna biel | wodny | akwamaryn | ||||
Lazur | Beżowy | For | blanszowany migdał | ||||
niebieskofioletowy | brązowy | Burlywood | Kadet niebieski | ||||
chartreuse | Czekolada | Koral | Chabrowy | ||||
kukurydziany | Karmazynowy | cyjan | ciemny niebieski | ||||
ciemnocyjan | ciemny złoty rod | ciemny szary | ciemnozielony | ||||
Darkkhaki | Darkmagenta | ciemnooliwkowozielony | ciemna pomarańcza | ||||
Ciemna orchidea | ciemno czerwony | ciemny łosoś | Ciemnomorska zieleń | ||||
ciemnoszary niebieski | ciemnoszara szarość | ciemnoturkusowy | Ciemnofioletowy | ||||
Głęboki róż | głęboki błękit nieba | Dimgray | niebieski sprytny | ||||
Ognista cegła | Kwiatowy biały | zielony las | Fuksja | ||||
Gainsboro | duch biały | Złoto | Nawłoć | ||||
Szary | Zielony żółty | spadzi | gorący róż | ||||
indyjski czerwony | Indygo | kość słoniowa | Khaki | ||||
Lawenda | Lawendowy rumieniec | Cytrynowy szyfon | jasny niebieski | ||||
jasny koral | jasnobłękitny | jasnycoldenrodyellow | jasnozielony | ||||
jasny szary | Jasnoróżowy | lekki łosoś | Jasnomorski zielony | ||||
Jasnoniebieski | Jasnoszary | jasnostalowy niebieski | jasny zółty | ||||
Limonka | Limonkowy | bielizna | Magenta | ||||
kasztanowaty | średni akwamaryn | średni niebieski | Średnia orchidea | ||||
Średni fioletowy | Średniozielony | Mediumslateblue | Średniozielony | ||||
średni turkus | średniofioletowy | niebieska północ | krem miętowy | ||||
mistyrosa | Navajowhite | Marynarka wojenna | staruszek | ||||
Oliwa | Olivedrab | pomarańczowy czerwony | Orchidea | ||||
palegoldenrod | Bladozielony | kolor turkusowy | bladofioletowy | ||||
papaja | Peachpuff | Peru | Różowy | ||||
Śliwka | Pudrowy niebieski | Różowobrązowy | Królewski niebieski | ||||
siodłowobrązowy | zielone morze | Muszla | Sjena | ||||
Srebro | niebieskie niebo | Odcień niebieskiego | Popielaty | ||||
Śnieg | Wiosenna zieleń | stalowo - niebieski | Dębnik | ||||
Cyraneczka | Oset | Pomidor | Turkus | ||||
fioletowy | Pszenica | Biały dym | żółty zielony |
Korzystanie z bezpiecznego próbnika kolorów
Niestety na różnych platformach, przy różnych ustawieniach systemu, problemem jest prawidłowe odwzorowanie kolorów. Rzecz w tym, że przeglądarka zawsze stara się dostosować paletę kolorów dokumentu do ustawień systemowych i możliwości monitora, samodzielnie mieszając i podmieniając kolory. W rezultacie czasami użytkownik nie do końca widzi, co webmaster chciał mu pokazać. Wyjściem z tej sytuacji było użycie palety, której każdy kolor gwarantuje, że będzie renderowany w ten sam sposób przez wszystkie przeglądarki na różnych platformach. To tak zwane gwarantowane paleta, znana również jako bezpieczna paleta. Ta paleta zawiera kolory, których składowe koloru przyjmują następujące wartości: 00 ,33 ,66 ,99 , CC,FF, we wszystkich możliwych 216 ich kombinacje.
pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod | pogląd | kod |
FFFFFF | CCCCCC | 999999 | 666666 | 333333 | 000000 | ||||||
CCCC66 | CCCC33 | 999966 | 999933 | 999900 | 666600 | ||||||
CCFF66 | CCFF00 | CCFF33 | CCCC99 | 666633 | 333300 | ||||||
99FF00 | 99FF33 | 99CC66 | 99CC00 | 99CC33 | 669900 | ||||||
CCFF99 | 99FF99 | 66CC00 | 66CC33 | 669933 | 336600 | ||||||
66FF00 | 66FF33 | 33FF00 | 33CC00 | 339900 | 009900 | ||||||
33FF33 | 00FF33 | 00FF00 | 00CC00 | 33CC33 | 00CC33 | ||||||
CCFFCC | 99CC99 | 66CC66 | 669966 | 336633 | 003300 | ||||||
99FF99 | 66FF66 | 33FF66 | 00FF66 | 339933 | 006600 | ||||||
66FF99 | 33FF99 | 00FF99 | 33CC66 | 00CC66 | 009933 | ||||||
66CC99 | 33CC99 | 00CC99 | 339966 | 009966 | 006633 | ||||||
99FFCC | 66FFCC | 33FFCC | 00FFCC | 33CCCC | 009999 | ||||||
CCFFFF | 99FFFF | 66FFFF | 33FFFF | 00FFFF | 00CCCC | ||||||
99CCCC | 66CCCC | 339999 | 669999 | 006666 | 336666 | ||||||
66CCFF | 33CCFF | 00CCFF | 3399CC | 0099CC | 003333 | ||||||
99CCFF | 3399 FF | 0099FF | 6699CC | 336699 | 006699 | ||||||
0066FF | 3366CC | 0066CC | 0033FF | 003399 | 003366 | ||||||
6699 FF | 3366FF | 0000FF | 0000CC | 0033CC | 000033 | ||||||
3333FF | 3300FF | 3300CC | 3333CC | 000099 | 000066 | ||||||
9999CC | 6666 FF | 6666CC | 666699 | 333399 | 333366 | ||||||
CCCCFF | 9999FF | 6666 FF | 6600 FF | 330099 | 330066 | ||||||
9966CC | 9966FF | 6600CC | 6633CC | 663399 | 330033 | ||||||
CC99FF | CC66FF | 9933FF | 9900 FF | 660099 | 663366 | ||||||
CC66FF | CC33FF | CC00FF | 9900CC | 996699 | 660066 | ||||||
CC99CC | CC66CC | CC33CC | CC00CC | 990099 | 993399 | ||||||
FFCCFF | FF99FF | FF66FF | FF33FF | FF00FF | CC3399 | ||||||
FF66CC | FF00CC | FF33CC | CC6699 | CC0099 | 990066 | ||||||
FF99CC | FF3399 | FF0099 | CC0066 | 993366 | 660033 | ||||||
FF6699 | FF3399 | FF0066 | CC3366 | 996666 | 663333 | ||||||
CC9999 | CC6666 | CC3333 | CC0000 | 990033 | 330000 | ||||||
FFCCCC | FF9999 | FF6666 | FF3333 | FF0000 | CC0033 | ||||||
FF6633 | CC3300 | FF3300 | FF0000 | CC0000 | 990000 | ||||||
FFCC99 | FFCC66 | FF6600 | CC6633 | 993300 | 660000 | ||||||
FF9900 | FF9933 | CC9966 | CC6600 | 996633 | 663300 | ||||||
FFCC66 | FFCC00 | FFCC33 | CC9900 | CC9933 | 996600 | ||||||
FFFFCC | FFFF99 | FFFF66 | FFFF33 | FFFF00 | CCCC00 |
W HTML kolor można określić na trzy sposoby:
Ustawianie koloru w HTML według jego nazwy
Niektóre kolory można określić za pomocą ich nazwy, używając nazwy koloru na język angielski. Najczęstsze słowa kluczowe: czarny (czarny), biały (biały), czerwony (czerwony), zielony (zielony), niebieski (niebieski) itp.:
Kolor tekstu — czerwony
Najpopularniejsze kolory standardu World Wide Web Consortium (W3C) to:
Kolor | Nazwać | Kolor | Nazwać | Kolor | Nazwać | Kolor | Nazwać |
---|---|---|---|---|---|---|---|
Czarny | Szary | Srebro | Biały | ||||
Żółty | Limonka | wodny | Fuksja | ||||
Czerwony | Zielony | Niebieski | Fioletowy | ||||
kasztanowaty | Oliwa | Marynarka wojenna | Cyraneczka |
Przykład użycia różnych nazw kolorów:
Przykład: ustawianie koloru według jego nazwy
- Spróbuj sam "
Nagłówek na czerwonym tle
Nagłówek na pomarańczowym tle
Nagłówek na tle limonki
Biały tekst na niebieskim tle
Nagłówek na czerwonym tle
Nagłówek na pomarańczowym tle
Nagłówek na tle limonki
Biały tekst na niebieskim tle
Określanie koloru za pomocą RGB
Podczas wyświetlania różnych kolorów na monitorze za podstawę przyjmuje się paletę RGB. Dowolny kolor uzyskuje się poprzez zmieszanie trzech głównych: R - czerwony, G - zielony (zielony), B - niebieski (niebieski). Jasność każdego koloru jest podawana przez jeden bajt i dlatego może przyjmować wartości od 0 do 255. Na przykład RGB (255,0,0) jest wyświetlany jako czerwony, ponieważ czerwony jest ustawiony na najwyższą wartość (255) i reszta jest ustawiona na 0 Możesz także ustawić kolor w procentach. Każdy z parametrów wskazuje poziom jasności odpowiedniego koloru. Na przykład: wartości rgb(127, 255, 127) i rgb(50%, 100%, 50%) ustawią ten sam zielony kolor średniego nasycenia:
Przykład: Określanie koloru za pomocą RGB
- Spróbuj sam "
rgb(127, 255, 127)
RGB (50%, 100%, 50%)
rgb(127, 255, 127)
RGB (50%, 100%, 50%)
Ustaw kolor według wartości szesnastkowej
Wartości R G B można również określić za pomocą szesnastkowych (HEX) wartości koloru w postaci: #RRGGBB gdzie RR (czerwony), GG (zielony) i BB (niebieski) to wartości szesnastkowe od 00 do FF (tak samo jak dziesiętne 0- 255) . System szesnastkowy, w przeciwieństwie do systemu dziesiętnego, opiera się, jak sama nazwa wskazuje, na liczbie 16. System szesnastkowy wykorzystuje następujące znaki: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Tutaj zamieniane są liczby od 10 do 15 z literami łacińskimi. Liczby większe niż 15 cali system szesnastkowy to połączenie dwóch znaków w jedną wartość. Na przykład najwyższa liczba 255 w systemie dziesiętnym odpowiada największemu FF w systemie szesnastkowym. W przeciwieństwie do systemu dziesiętnego, liczba szesnastkowa jest poprzedzona znakiem krzyżyka. # , na przykład #FF0000 jest wyświetlany jako czerwony, ponieważ czerwony jest ustawiony na najwyższą wartość (FF), a pozostałe kolory są ustawione na ich minimalną wartość (00). Znaki po symbolu hash # można pisać zarówno wielkimi, jak i małymi literami. System szesnastkowy pozwala na użycie skróconej formy #rgb, gdzie każdy znak jest równy dwa razy. Dlatego wpis #f7O należy uznać za #ff7700.
Przykład: Kolor HEX
- Spróbuj sam "
czerwony: #FF0000
zielony: #00FF00
niebieski: #0000FF
czerwony: #FF0000
zielony: #00FF00
niebieski: #0000FF
czerwony+zielony=żółty: #FFFF00
czerwony+niebieski=fioletowy: #FF00FF
zielony+niebieski=cyjan: #00FFFF
Lista najczęściej używanych kolorów (nazwa, HEX i RGB):
angielski tytuł | Rosyjskie imię | Próbka | KLĄTWA | RGB | ||
---|---|---|---|---|---|---|
amarant | amarant | #E52B50 | 229 | 43 | 80 | |
Bursztyn | Bursztyn | #FFBF00 | 255 | 191 | 0 | |
wodny | niebieski zielony | #00FFFF | 0 | 255 | 255 | |
Lazur | Lazur | #007FFF | 0 | 127 | 255 | |
Czarny | Czarny | #000000 | 0 | 0 | 0 | |
Niebieski | Niebieski | #0000FF | 0 | 0 | 255 | |
Niebieski Bondi | Woda na plaży Bondi | #0095B6 | 0 | 149 | 182 | |
Mosiądz | Mosiądz | #B5A642 | 181 | 166 | 66 | |
brązowy | brązowy | #964B00 | 150 | 75 | 0 | |
Cerulean | Lazur | #007BA7 | 0 | 123 | 167 | |
ciemna wiosenna zieleń | Ciemna wiosenna zieleń | #177245 | 23 | 114 | 69 | |
Szmaragd | Szmaragd | #50C878 | 80 | 200 | 120 | |
Bakłażan | bakłażan | #990066 | 153 | 0 | 102 | |
Fuksja | Fuksja | #FF00FF | 255 | 0 | 255 | |
Złoto | Złoto | #FFD700 | 250 | 215 | 0 | |
Szary | Szary | #808080 | 128 | 128 | 128 | |
Zielony | Zielony | #00FF00 | 0 | 255 | 0 | |
Indygo | Indygo | #4B0082 | 75 | 0 | 130 | |
Jadeit | Jadeit | #00A86B | 0 | 168 | 107 | |
Limonka | Limonka | #CCFF00 | 204 | 255 | 0 | |
Malachit | Malachit | #0BDA51 | 11 | 218 | 81 | |
Marynarka wojenna | ciemnoniebieski | #000080 | 0 | 0 | 128 | |
Ochra | Ochra | #CC7722 | 204 | 119 | 34 | |
Oliwa | Oliwa | #808000 | 128 | 128 | 0 | |
Pomarańczowy | Pomarańczowy | #FFA500 | 255 | 165 | 0 | |
brzoskwinia | Brzoskwinia | #FFE5B4 | 255 | 229 | 180 | |
Dynia | Dynia | #FF7518 | 255 | 117 | 24 | |
Fioletowy | Fioletowy | #800080 | 128 | 0 | 128 | |
Czerwony | Czerwony | #FF0000 | 255 | 0 | 0 | |
Szafran | Szafran | #F4C430 | 244 | 196 | 48 | |
morska zieleń | zielone morze | #2E8B57 | 46 | 139 | 87 | |
Bagno zielone | Bołotny | #ACB78E | 172 | 183 | 142 | |
Cyraneczka | niebieski zielony | #008080 | 0 | 128 | 128 | |
Ultramaryna | ultramaryna | #120A8F | 18 | 10 | 143 | |
fioletowy | Fioletowy | #8B00FF | 139 | 0 | 255 | |
Żółty | Żółty | #FFFF00 | 255 | 255 | 0 |
Kody kolorów (tła) według nasycenia i odcienia.
Jak wiesz, kolor może wpływać na stan osoby: zarówno psychiczny, jak i fizyczny. Każdego dnia, przeglądając Internet, oczy oceniają miliony kolorów i odcieni. Projektant stron internetowych, który jest zaznajomiony z psychologią koloru, może kontrolować nastrój odwiedzającego, aby osiągnąć dowolne cele.
Wynika to z faktu, że niektóre odcienie koją, a niektóre wręcz podniecają. Następnie porozmawiamy o tym, jak kolor jest syntetyzowany i wyświetlany za pomocą technologii komputerowej.
RGB to model kolorów, który reprezentuje sposób uzyskiwania wszystkich kolorów i ich odcieni poprzez mieszanie w różnych proporcjach trzech głównych składników, którymi są:
- Kolor czerwony ( Czerwony);
- zielony kolor ( Zielony);
- niebieski kolor ( Niebieski).
Stąd pochodzi skrócona nazwa RGB. Kolory te są wybierane jako główne nie bez powodu: powodem jest fizjologia siatkówki ludzkiego oka i sposób ich postrzegania:
Model RGB jest zdecydowanie najbardziej popularny i służy do odtwarzania kolorów na ekranach telewizorów i monitorach komputerowych. Ponieważ producenci wyposażają swoje produkty różne cechy, w 1996 roku powstała jeden system synteza kolorów oparta na RGB o nazwie sRGB , nad którą wspólnie pracowali Microsoft i HP.
Numeryczna reprezentacja kolorów
Jak wspomniano wcześniej, kolory RGB są tworzone przez mieszanie kolorów podstawowych. Do opisu intensywności każdego z nich przyjęto schemat, w którym kolor jest reprezentowany przez zakres 0-255 (8 bitów), co odpowiada wartości 00-FF w systemie szesnastkowym.
Oznacza to, że kolory podstawowe będą wyglądać tak:
- Czerwony — RGB (255.0.0);
- Zielony — RGB (0,255,0);
- Niebieski — RGB (0.0.255);
Jeżeli intensywność koloru przyjmuje wartości mniejsze niż 255, to uzyskuje się różne odcienie czerwieni, zieleni i niebieskiego. Poniżej znajduje się tabela ich gradacji, a także wartości szesnastkowych każdego z odcieni:
Wykresy kolorów RGB
Oczywiście oprócz gradacji kolorów podstawowych są też mieszane, a ich liczba jest dość duża. W związku z tym powstała tabela kolorów RGB, która prezentuje wszystkie istniejące odcienie, a także ich nazwy i reprezentacje liczbowe ( w postaci dziesiętnej i szesnastkowej).
Tutaj możesz ją poznać. Ten stół znacznie ułatwia życie projektantom stron internetowych, ponieważ w ciągu kilku sekund można znaleźć żądany odcień i poznać jego numeryczne przedstawienie.
Bezpieczna paleta kolorów RGB
Jednak w pewnym momencie pojawił się problem z wyświetlaniem kolorów w różnych przeglądarkach i aby go rozwiązać, skompilowano tzw. „bezpieczną” paletę kolorów RGB, którą wyprowadzono na podstawie obliczeń matematycznych.
Gdy przeglądarka nie może poprawnie wyświetlić koloru, próbuje zbliżyć się do tego, czego potrzebuje, mieszając sąsiednie kolory, i najprawdopodobniej wynik będzie całkowicie nie do przyjęcia:
Używając kodów kolorów RGB z tej palety, programista może mieć pewność, że wyświetla kolory na stronach swojej witryny podczas przeglądania przy użyciu różnych przeglądarek, platform i monitorów. Chociaż włączony ten moment tabela bezpiecznych kolorów traci na znaczeniu ( postęp technologiczny nie stoi w miejscu), używając go, możesz, jak mówią, spać spokojnie.
Złoty kolor w modelu RGB
Po raz pierwszy słowo „złoto” zostało użyte na początku XIV wieku na określenie koloru pierwiastek chemiczny zwany Aurum - złoto. W modelu RGB kolor złoty reprezentują następujące wartości liczbowe:
- RGB (255, 215, 0) - system dziesiętny;
- HEX #FFD700 - system szesnastkowy.
Kolor beżowy w modelu RGB
Beż zajmuje dość znaczące miejsce w historii, nawet jeśli nie jest najbardziej wyrazisty. Wiele zabytków kultury, zwłaszcza antycznych rzeźb, zostało wykonanych ze steatytu i steatytu, które mają beżowy odcień. W modelu RGB kolor beżowy ma następujące reprezentacje liczbowe:
- RGB (245, 245, 220) - system dziesiętny;
- HEX #F5F5DC - system szesnastkowy.
W dzisiejszych czasach, zwłaszcza w sieci WWW, rzadko można znaleźć tak „nudny” kolor. Deweloperzy preferują chwytliwy design, używając żywe kolory. Postęp technologiczny umożliwia wyświetlanie ogromnej ilości kolorów na monitorach, co czyni obraz bardziej realistycznym.
Dobry zły
Vlad Merzhevich
W HTML kolor określa się na dwa sposoby: za pomocą kodu szesnastkowego oraz nazw niektórych kolorów. Najczęściej stosowana metoda oparta jest na systemie szesnastkowym, jako najbardziej uniwersalna.
Kolory szesnastkowe
HTML używa liczb szesnastkowych do określenia kolorów. System szesnastkowy, w przeciwieństwie do systemu dziesiętnego, opiera się, jak sama nazwa wskazuje, na liczbie 16. Liczby te będą następujące: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Liczby od 10 do 15 zastępuje się literami łacińskimi. W tabeli. 6.1 pokazuje zgodność między liczbami dziesiętnymi i szesnastkowymi.
Liczby większe niż 15 w systemie szesnastkowym są tworzone przez połączenie dwóch liczb w jedną (tabela 6.2). Na przykład liczba 255 w systemie dziesiętnym odpowiada liczbie FF w systemie szesnastkowym.
Aby uniknąć nieporozumień w definicji systemu liczbowego, liczbę szesnastkową poprzedza znak krzyżyka #, na przykład #aa69cc. W tym przypadku sprawa nie ma znaczenia, więc dopuszczalne jest napisanie #F0F0F0 lub #f0f0f0.
Typowy kolor używany w HTML jest następujący.
Tutaj kolor tła strony internetowej jest ustawiony na #FA8E47. Znak funta # przed liczbą oznacza, że jest to liczba szesnastkowa. Pierwsze dwie cyfry (FA) określają składową czerwoną koloru, cyfry od trzeciej do czwartej (8E) składową zieloną, a dwie ostatnie cyfry (47) składową niebieską. Efektem końcowym jest ten kolor.
FA | + | 8E | + | 47 | = | FA8E47 |
Każdy z trzech kolorów – czerwony, zielony i niebieski – może przyjmować wartości od 00 do FF, co ostatecznie tworzy 256 odcieni. Zatem całkowita liczba kolorów może wynosić 256x256x256 = 16.777.216 kombinacji. Model kolorów oparty na składowych czerwonym, zielonym i niebieskim nazywa się RGB (czerwony, zielony, niebieski; czerwony, zielony, niebieski). Model ten jest addytywny (od add - add), w którym po dodaniu wszystkich trzech składników powstaje kolor biały.
Aby ułatwić nawigację w kolorach szesnastkowych, weź pod uwagę pewne zasady.
- Jeśli wartości składników koloru są takie same (na przykład: #D6D6D6), otrzymujesz szary odcień. Jak więcej numeru, jaśniejszy kolor, zmieniający się z #000000 (czarny) na #FFFFFF (biały).
- Jasnoczerwony kolor powstaje, gdy czerwony składnik jest ustawiony na maksimum (FF), a pozostałe składniki są ustawione na zero. Kolor o wartości #FF0000 to najbardziej czerwony odcień czerwieni. Podobnie jest w przypadku w zielonym(#00FF00) i niebieski (#0000FF).
- Żółty(#FFFF00) uzyskuje się przez zmieszanie koloru czerwonego z zielonym. Widać to wyraźnie na kole barw (rys. 6.1), które przedstawia kolory podstawowe (czerwony, zielony, niebieski) oraz uzupełniające lub uzupełniające. Należą do nich żółty, cyjan i fioletowy (zwany również magenta). Generalnie dowolny kolor można uzyskać poprzez zmieszanie sąsiadujących z nim kolorów. Tak więc cyjan (#00FFFF) uzyskuje się przez połączenie niebieskiego i zielonego.
Ryż. 6.1. Koło kolorów
Kolory oparte na wartościach szesnastkowych nie muszą być wybierane empirycznie. W tym celu odpowiedni jest edytor graficzny, który może pracować z różnymi modele kolorów takich jak Adobe Photoshop. Na ryc. 6.2 pokazuje okno wyboru koloru w tym programie, linia zakreśla wynikową wartość szesnastkową bieżącego koloru. Możesz go skopiować i wkleić do swojego kodu.
Ryż. 6.2. Próbnik kolorów w Photoshopie
Kolory internetowe
Jeśli ustawisz jakość kolorów monitora na 8-bitową (256 kolorów), ten sam kolor może być wyświetlany w różne przeglądarki na mój własny sposób. Ma to związek ze sposobem renderowania grafiki, gdy przeglądarka pracuje z własną paletą i nie może pokazać koloru, którego nie ma w palecie. W tym przypadku kolor zostaje zastąpiony kombinacją pikseli innych, bliskich mu kolorów, które imitują dany. Aby kolor pozostał taki sam w różnych przeglądarkach, wprowadzono paletę tak zwanych kolorów internetowych. Kolory internetowe to te kolory, dla których każdego składnika - czerwonego, zielonego i niebieskiego - ustawiono jedną z sześciu wartości - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC), 255 (FF). Wartość szesnastkowa tego składnika jest podana w nawiasach. Całkowity kolory ze wszystkich możliwych kombinacji daje 6x6x6 - 216 kolorów. Przykładowy kolor internetowy to #33FF66.
Główną cechą koloru internetowego jest to, że jest wyświetlany tak samo we wszystkich przeglądarkach. W chwili obecnej znaczenie kolorów internetowych jest bardzo małe ze względu na poprawę jakości monitorów i rozszerzenie ich możliwości.
Kolory według nazwy
Aby nie zapamiętywać zbioru liczb, możesz zamiast tego użyć nazw powszechnie używanych kolorów. W tabeli. 6.3 pokazuje nazwy popularnych nazw kolorów.
Nazwa koloru | Kolor | Opis | Wartość szesnastkowa |
---|---|---|---|
czarny | Czarny | #000000 | |
niebieski | Niebieski | #0000FF | |
fuksja | Jasny fiolet | #FF00FF | |
szary | Ciemno szary | #808080 | |
Zielony | Zielony | #008000 | |
Limonka | jasnozielony | #00FF00 | |
kasztanowaty | Ciemno czerwony | #800000 | |
marynarka wojenna | ciemnoniebieski | #000080 | |
Oliwa | Oliwa | #808000 | |
fioletowy | Ciemny fiolet | #800080 | |
czerwony | Czerwony | #FF0000 | |
Srebro | jasny szary | #C0C0C0 | |
cyraneczka | niebieski zielony | #008080 | |
biały | Biały | #FFFFFF | |
żółty | Żółty | #FFFF00 |
Nie ma znaczenia, w jaki sposób określisz kolor - według jego nazwy lub za pomocą liczb szesnastkowych. W efekcie metody te są równe. Przykład 6-1 pokazuje, jak ustawić kolor tła i tekstu na stronie internetowej.
Przykład 6.1. Kolor tła i tekstu
Przykładowy tekst
W tym przykładzie kolor tła jest ustawiany za pomocą atrybutu bgcolor znacznika
i kolor tekstu za pomocą atrybutu text. Dla urozmaicenia, wartość atrybutu tekstowego jest ustawiana na liczbę szesnastkową, a bgcolor jest ustawiana na wartość zastrzeżoną. słowo kluczowe cyraneczka.Kody Minecraft zabarwienie lub Minecraft kody formatowanie, pozwól każdemu graczowi dodawać kwiaty i formatować tekst w każdy możliwy sposób bezpośrednio w grze Minecraft. Kody kolorów od &0-9 do &a-f. Dodaj je przed tekstem. Wiadomości od graczy mogą zawierać kody kolorów, które pozwalają dodać kolor do zdań.
Kolory i kody formatowania
Znak ampersand (&), po którym następuje liczba szesnastkowa w wiadomościach, sygnalizuje klientowi zmianę kolorów podczas wyświetlania tekstu. Alternatywnie tekst można sformatować za pomocą znaku &, po którym następuje litera. Możesz dodać różne kolory do książek, bloków poleceń, nazwy serwera, opisu serwera (motd), nazw światów, znaków, a nawet nazw graczy.
Bardzo łatwo jest sformatować tekst w konfiguracjach lub w grze, korzystając z poniższej tabeli kolorów. &r służy do kasowania wszystkich kodów, tj. &mAAA&rBBB będzie wyświetlany jako AAA BBB.
Dla Twojej wygody przedstawiamy tabelę istniejących kodów kolorów w grze Minecraft:
Kod | Nazwać | Nazwa techniczna | Kolor symbolu | Kolor cienia symbolu | ||||||
---|---|---|---|---|---|---|---|---|---|---|
R | G | B | klątwa | R | G | B | klątwa | |||
&0 | Czarny | czarny | 0 | 0 | 0 | 000000 | 0 | 0 | 0 | 000000 |
&1 | ciemnoniebieski | ciemny niebieski | 0 | 0 | 170 | 0000AA | 0 | 0 | 42 | 00002A |
&2 | ciemnozielony | ciemnozielony | 0 | 170 | 0 | 00AA00 | 0 | 42 | 0 | 002A00 |
&3 | Ciemno niebiesko-zielony | ciemny_aqua | 0 | 170 | 170 | 00AAAA | 0 | 42 | 42 | 002A2A |
&4 | Ciemno czerwony | ciemno czerwony | 170 | 0 | 0 | AA0000 | 42 | 0 | 0 | 2A0000 |
&5 | Ciemny fiolet | ciemny fiolet | 170 | 0 | 170 | AA00AA | 42 | 0 | 42 | 2A002A |
&6 | Złoto | złoto | 255 | 170 | 0 | FFAA00 | 42 | 42 | 0 | 2A2A00 |
&7 | Szary | szary | 170 | 170 | 170 | AAAAAA | 42 | 42 | 42 | 2A2A2A |
&8 | Ciemno szary | ciemny szary | 85 | 85 | 85 | 555555 | 21 | 21 | 21 | 151515 |
&9 | Niebieski | niebieski | 85 | 85 | 255 | 5555FF | 21 | 21 | 63 | 15153F |
&a | Zielony | Zielony | 85 | 255 | 85 | 55FF55 | 21 | 63 | 21 | 153F15 |
&b | niebieski zielony | wodny | 85 | 255 | 255 | 55FFFF | 21 | 63 | 63 | 153F3F |
&c | Czerwony | czerwony | 255 | 85 | 85 | FF5555 | 63 | 21 | 21 | 3F1515 |
&d | Jasny fiolet | Jasny fiolet | 255 | 85 | 255 | FF55FF | 63 | 21 | 63 | 3F153F |
&mi | Żółty | żółty | 255 | 255 | 85 | FFFF55 | 63 | 63 | 21 | 3F3F15 |
&f | Biały | biały | 255 | 255 | 255 | FFFFFF | 63 | 63 | 63 | 3F3F3F |
Czasami jest to konieczne podkreślenie, podkreślenie, atrakcja jakiś tekst. W tym celu używane jest formatowanie tekstu. Używa się go tak samo jak kolorów (przed tekstem, który wstawiamy) kod, na przykład &lMinecraft= Minecraft.
Dla Twojej wygody poniżej znajduje się tabela kodów do formatowania:
Kod | Nazwać |
---|---|
&k | magiczny tekst |
&l | Miniaturka |
&m | Tekst przekreślony |
&n | Podkreślony tekst |
&o | Tekst kursywą |
&r | Tekst bez formatowania |