Podstawy#

Kodowanie znaków#

Arkusze stylów to dane tekstowe, które będą pobierane przez przeglądarkę, i w następnej kolejności odpowiednio przetwarzane. Przeglądarka pobiera strumień bajtów (stream of bytes) pochodzący zazwyczaj z sieci lub lokalnego systemu plików. Dopiero potem ustala, jakiego kodowania użyto w danym pliku, aby móc prawidłowo zdekodować otrzymane dane.

Rodzaj kodowania użytego w arkuszach CSS ustalany jest za pomocą algorytmu określania kodowania zwrotnego # (determine the fallback encoding), wyrażanego następującymi krokami:

  1. Jeśli protokół HTTP lub jego odpowiednik definiuje kodowanie (np. przy użyciu parametru charset w nagłówku Content-Type), to pobierz kodowanie w podanej postaci. Jeśli operacja ta nie zwróci błędnego wyniku, to użyj zwróconą wartości jako kodowania zwrotnego.

  2. W przeciwnym razie, sprawdź strumień bajtów. Jeśli pierwsze kilka bajtów pasuje do heksadecymalnej sekwencji:

    40 63 68 61 72 73 65 74 20 22 (not 22)* 22 3B

    to pobierz zakodowane sekwencje z bajtów (not 22)*, zdekodowane za pomocą windows-1252.

    Wszystko, co będzie zgodne ze standardem ASCII się sprawdzi, dlatego użycie windows-1252 jest prawidłowe.

    Kiedy w powyższej sekwencji bajtów, zdekodowanej jako ASCII, występuje łańcuch @charset "...";, to część "..." jest sekwencją bajtów odpowiadającą nazwie kodowania.

    Jeśli zwracaną wartością jest utf-16 lub utf-16be, to użyj utf-8 jako kodowania zwrotnego. Jeśli będzie to inna wartość, prócz wartości błędnej, to użyj zwracaną wartość jako kodowania zwrotnego.

    To naśladuje zachowanie znacznika <meta> z HTML-a.

  3. W przeciwnym razie, jeśli kodowanie środowiska jest dostarczane przez odwołujący dokument, to użyj go jako kodowania zwrotnego.

  4. W przeciwnym razie, użyj utf-8 jako kodowania zwrotnego.

Po ustaleniu kodowania zwrotnego przeglądarka dekoduje za jego pomocą strumień bajtów i przechodzi do dalszych etapów przetwarzania tak zdekodowanych danych.

Algorytm dekodujący stosowany przez CSS nadaje znacznikowi kolejności bajtów (BOM) wyższy priorytet niż opisywane tutaj kodowanie zwrotne. Wynika to głównie z chęci zapewnienia kompatybilności z już wdrożonymi treściami, dlatego znacznik BOM jest uznawany za bardziej wiarogodny, niż cokolwiek innego.

Kodowanie środowiska#

Języki znacznikowe, które odwołują się do arkuszy CSS w postaci zdekodowanego ciągu bajtów, muszą określać kodowanie środowiska # (environment encoding) dla każdego takiego arkusza, które jest używane w przypadku, gdy inne podpowiedzi kodowania nie są dostępne lub nie mogą być użyte.

Poniższe reguły prawdopodobnie przeniesione zostaną ze specyfikacji "CSS Syntax Module Level 3" do innych specyfikacji, niemniej jednak wciąż będą obowiązywały.

Reguła @import#

Dla arkuszy stylów wskazywanych przez CSS-ową regułę @import, kodowaniem środowiska jest kodowanie we wskazującym arkuszu stylów.

HTML#

Dla arkuszy stylów wskazywanych przez HTML-owy element <link rel="stylesheet">, kodowanie środowiska jest ustalane następująco:

Specyfikacja HTML5 uznaje atrybut charset w elemencie link za przestarzały i niezgodny. W praktyce żadna aktualna przeglądarka nie wdrożyła jego obsługi do dnia dzisiejszego.

XML#

Dla arkuszy stylów wskazywanych przez instrukcję przetwarzania xml-stylesheet, kodowanie środowiska jest ustalane następująco:

Reguła @charset#

Kodowanie w arkuszach stylów bardzo często definiuje się za pomocą reguły @charset, która stanowi wyspecjalizowaną odmianę reguły małpy. Z akademickiego punktu widzenia jej składnia wygląda następująco:

  1. L
  2. K
  3. T'
  4. T
  5. A
  6. O
  7. Z'
  8. Z
  9. #
<at-charset-rule> = @charset <string>;

Dodatkowo, reguła @charset jest nieważna, jeśli nie jest umieszczona na najwyższym poziomie arkusza CSS, lub jeśli nie jest to pierwsza reguła tego arkusza - nie może być poprzedzona żadnym innym znakiem (nawet komentarzem).

Reguła @charset posiada kodowanie (encoding), wyrażane za pomocą wartości <string>. Na przykład, aby oznaczyć kodowanie arkusza CSS w UTF-8 wprowadza się następujące polecenie:

  1. L
  2. K
  3. T'
  4. T
  5. A
  6. O
  7. Z'
  8. Z
  9. #
@charset "UTF-8";

/* lub */

@charset 'UTF-8';

Reguła @charset nie ma wpływu na arkusz stylów.

Według wielu źródeł (np. z W3C lub MDN) dyrektywa @charset ma zastosowanie jedynie w zewnętrznych arkuszach stylów, co jest zgodne z poprzednią specyfikacją CSS 2.01. Nie wiem czemu, ale w najnowszym module nie widzę żadnej wzmianki na ten temat.

Warto przypomnieć, że algorytm określania kodowania zwrotnego przegląda pierwszych kilka bajtów w arkuszu CSS, aby zobaczyć, czy nie pasują one do znaków ASCII w postaci @charset "XXX";, gdzie XXX to sekwencja bajtów inna niż 22 (znak " w ASCII). Chociaż przypomina to regułę @charset, wcale nie oznacza tego samego. Dla przykładu, oczekiwana sekwencja bajtów wyrazi zupełnie co innego, jeśli arkusz stylów jest kodowany w niekompatybilnym z ACSII standardzie, takim jak UTF-16.

Można powiedzieć, że wykrywanie kodowania za pomocą reguł @charset działa jedynie na wzorcowych bajtach kompatybilnych z ASCII. Reguły @charset wprowadzone za pomocą kodowania niekompatybilnego z ASCII są pomijane, w przeciwnym wypadku spowodowałoby to, że sama reguła nie zostałaby poprawnie zdekodowana. Wzmianka o tym pojawia się w wykazie zmian dla modułu opisującego składnię CSS.

Kiedy deklarować kodowanie dla CSS?#

W arkuszach CSS najczęściej stosuje się jedynie znaki amerykańskie (ze standardu ACSII), dlatego mało kto zwraca uwagę na deklarację użytego kodowania. Niemniej jednak, informacja na temat kodowania znaków jest oczywiście zawsze istotną jeśli selektory CSS odnoszą się do nazw elementów, nazw atrybutów, lub wartości atrybutów, które nie są zgodne z ASCII (np. selektory typu .źdźbło czy #kość). Ta sama uwaga dotyczy wartości w niektórych właściwościach, np. content lub font-family, jak również komentarzy CSS.

Może być to szczególnie przydatne w sytuacji, kiedy informacja o kodowaniu nie jest wysyłana w nagłówkach HTTP, bo np. odczytujemy pliki lokalnie (bez użycia serwera WWW). Trzeba pamiętać również o tym, że w przypadku starszych przeglądarek omawiane sposoby (oraz ich hierarchia) może działać w sposób nieprawidłowy.

Pasek społecznościowy

SPIS TREŚCI AKTUALNEJ STRONY

Podstawy (H1) Kodowanie znaków (H2) Kodowanie środowiska (H3) Reguła @import (H4) HTML (H4) XML (H4) Reguła @charset (H3) Kiedy deklarować kodowanie dla CSS? (H3)