Przejdź do treści

Centrum Kształcenia Zawodowego i Ustawicznego w Mrągowie

CSS: Heksadecymalny zapis kolorów

piątek,

CSS: Heksadecymalny zapis kolorów

Kolory w CSS można określać za pomocą różnych metod, w tym za pomocą kodów heksadecymalnych (HEX). Format heksadecymalny jest jednym z najpopularniejszych sposobów definiowania kolorów w projektowaniu stron internetowych i aplikacji. To bardzo wygodne rozwiązanie, ponieważ zapewnia szeroki zakres barw i jest łatwy do zrozumienia i stosowania dla większości projektantów i deweloperów stron internetowych.

Format Heksadecymalny

Kod heksadecymalny składa się z symbolu '#', po którym następuje sześć cyfr lub liter w zakresie od 0 do 9 oraz od A do F. Te sześć znaków dzieli się na trzy pary, gdzie każda para odpowiada jednemu z kolorów podstawowych: czerwony (R), zielony (G) i niebieski (B).

  • Pierwsza para znaków określa wartość czerwonego (R).
  • Druga para określa wartość zielonego (G).
  • Trzecia para określa wartość niebieskiego (B).

Przykłady:

  1. Biały: '#FFFFFF'

    • R: FF (255 w systemie dziesiętnym)
    • G: FF (255 w systemie dziesiętnym)
    • B: FF (255 w systemie dziesiętnym)
  2. Czarny: '#000000'

    • R: 00 (0 w systemie dziesiętnym)
    • G: 00 (0 w systemie dziesiętnym)
    • B: 00 (0 w systemie dziesiętnym)
  3. Czerwony: '#FF0000'

    • R: FF (255 w systemie dziesiętnym)
    • G: 00 (0 w systemie dziesiętnym)
    • B: 00 (0 w systemie dziesiętnym)
  4. Zielony: '#00FF00'

    • R: 00 (0 w systemie dziesiętnym)
    • G: FF (255 w systemie dziesiętnym)
    • B: 00 (0 w systemie dziesiętnym)
  5. Niebieski: '#0000FF'

    • R: 00 (0 w systemie dziesiętnym)
    • G: 00 (0 w systemie dziesiętnym)
    • B: FF (255 w systemie dziesiętnym)

Skrócony Format HEX

W CSS istnieje również skrócona wersja kodu HEX, gdzie każda para jest reprezentowana przez pojedynczy znak. Na przykład, '#FFF' jest skrótem od '#FFFFFF' (biały), a '#F00' od '#FF0000' (czerwony). Skrócona forma jest możliwa, gdy w każdej parze obie cyfry są takie same.

Przykład użycia

Kody heksadecymalne są stosowane w CSS do określania kolorów elementów, takich jak tło, tekst, ramki itp.

body {
    background-color: #FF5733;  /* Pomarańczowy */
}

h1 {
    color: #00FF00;  /* Zielony */
}

p {
    color: #0000FF;  /* Niebieski */
}
Artykuł: Pierwszy dzień w Splicie

Pierwszy dzień w Splicie

Artykuł: OpenSolaris

OpenSolaris

Artykuł: Bob Frankston

Bob Frankston

Artykuł: Staże w Chorwacji

Staże w Chorwacji

Artykuł: 3Com

3Com

Nasze technikum

Technik informatyk

Szkoły dla dorosłych

Nasza szkoła

Pełna oferta edukacyjna

Oferta szkoły