Home WEB i technologie Kolory w HTML
WEB i technologie - 27 czerwca 2020

Kolory w HTML

Jak w języku HTML tworzyć kolory?

Znając już podstawowe znaczniki i składnię dokumentu HTML warto dowiedzieć się jak zmieniać kolory poszczególnych elementów (czcionki, pola). W dokumentach HTML kolory można określać na 3 różne sposoby: stosując zapis szesnastkowy (hex), posługując się modelami przestrzeni barw (RGB, RGBA, HSL, HSLA) lub korzystając z predefiniowanych nazw w języku angielskim. Nadanie barw poszczególnym elementom jest zadaniem należącym do kaskadowych arkuszy stylów (CSS). Jeżeli jednak istnieje potrzeba zmiany koloru bezpośrednio w HTMLu można skorzystać z atrybutu color. Aby zadziałał poprawnie należy umieścić go w tagu otwierającym daną zawartość. Prawidłowy zapis wygląda tak:

html kolory

W zastosowanym powyżej przykładzie posłużono się takiem <p> tj. paragrafem, a wartość określającą kolor czerwony przedstawiono w predefiniowanej nazwie w języku angielskim. Równie dobrze, zamiast słowa „red” można użyć zapisu HEX tj. w tym przypadku #ff0000 lub rgb(255, 0, 0) w modelu przestrzeni barw.

ebook html

Hex – zapis heksadecymalny kolorów

Jak zapisywać kolory w HTML? Najpopularniejszym sposobem przedstawienia kolorów w HTML jest zapis szesnastkowy (ang. hex triplet), czyli w skrócie hex. Składa się on z hashtaga (#) oraz sześciu cyfr szesnastkowych, których następujące po sobie pary odpowiadają kolejno za barwy: czerwoną, zieloną i niebieską. Każda taka para cyfr, zwana bajtem, przyjmuje wartości z przedziału od 00 (0) do FF (255). Im wartość jest większa, tym bardziej intensywny komponent otrzymujemy. Przykładowo zapis #FF0000 jest renderowany na czerwono, ponieważ czerwony składnik posiada maksymalną wartość, a pozostałe są ustawione na 0.

Zobacz też: Składnia HTML

Kod koloru składa się z sześciu cyfr, nawet w przypadku, gdy intensywność jednej z barw jest mniejsza niż 16 (w zapisie szesnastkowym składa się z jednej cyfry). Wówczas jej wartość musi poprzedzać 0. Na przykład, odcień zielonego, w którym czerwony posiada wartość 1, zielony 170 (czyli AA), a niebieski 9 będzie wyglądał następująco: #01AA09. Zapis heksadecymalny może zostać skrócony tylko wtedy, kiedy każdy bajt składa się z takich samych cyfr, np. 1122AA można zapisać jako 12A.

Poniżej przedstawiony został wykaz przykładowych kolorów, możliwych do zastosowania podczas Tworzenia własnego dokumentu HTML. W pierwszej kolumnie wskazano nazwę angielską, w drugiej HEX, trzecia zaś prezentuje docelowy kolor, który pojawi się na tworzonej przez Was stronie www.

html kolory

Sprawdź również

Jak sprawdzić czy telefon jest na podsłuchu?

Hakerzy, złodzieje lub służby mogą dziś mieć dostęp do naszego urządzenia głównie za pomoc…