Czym jest CSS?

Zadaniem HTML-a nie było prezentowanie zaawansowanej grafiki ani elementów multimedialnych. W rzeczywistości HTML nigdy nie miał być czymkolwiek więcej niż tylko uniwersalnym językiem przetwarzania tekstów rozpowszechnianych za pośrednictwem Internetu, w dodatku językiem o raczej ograniczonych możliwościach. Z czasem do WWW dodane zostały nowe znaczniki i technologie, takie jak tabele, ramki, kontrola nad wyrównywaniem tekstu czy też JavaScript, które umożliwiły lepszą kontrolę nad wyglądem dokumentów HTML-owych. Mimo tego, wiele efektów na stronie WWW projektanci musieli tworzyć w oparciu o programy graficzne, a ściągnięcie rezultatów ich pracy z serwera trwało dosyć długo (przy ówczesnych prędkościach połączeń). W związku z tym twórcy stron WWW zaczęli głośno domagać się od World Wide Web Consorcium udostępnienia większej kontroli nad projektem strony Internetowej. Odpowiedzią W3C na apel programistów było wprowadzenie kaskadowych arkuszy stylów (zwanych CSS – z języka angielskiego – Cascading Style Sheets), których zadaniem było uzupełnienie braków prostego języka HTML^.

Kaskadowe arkusze stylów to lista poleceń (zwanych regułami), które informują przeglądarkę o tym, w jaki sposób ma interpretować i wyświetlać zawartość danego elementu na stronie Internetowej. Umożliwiają one zdefiniowanie wspólnych stylów (cech) dla praktycznie każdego elementu, na przykład rodzaju i koloru czcionki, wysokości i szerokości tabeli, koloru tła czy pozycji danego elementu na stronie. CSS został stworzony, aby oddzielić strukturę strony od formy wyświetlania poszczególnych jej elementów, co zdecydowanie ułatwia pracę programisty, chociażby w przypadku konieczności modyfikacji dużej liczby modułów w serwisie.

Wspaniałą cechą arkuszy stylów jest fakt, iż są one bardzo łatwe do stworzenia. Nie są do tego potrzebne żadne dodatkowe aplikacje – wystarczają jedynie tak zwane reguły. Reguły CSS określają, jak kod HTML-owy ma wyglądać oraz jak ma się zachowywać w oknie przeglądarki. Mogą być one tworzone, aby poinstruować znacznik HTML-owy, jak powinien wyświetlić swoją zawartość. Można dzięki nim również, zdefiniować ogólne reguły i samodzielnie przyporządkować je poszczególnym znacznikom w kodzie. Reguły mogą być umieszczane w trzech różnych miejscach:

1. Reguły wpisane – umieszczone bezpośrednio w znaczniku HTML-owym
i odnoszące się tylko do tego jednego danego znacznika.

2. Reguły osadzone – umieszczone w nagłówku dokumentu, odnoszące się do całej zawartości danego dokumentu.

3. Reguły zewnętrzne – osadzone w zewnętrznym dokumencie, wspólne dla wielu dokumentów.

Kaskadowość arkuszy styków oznacza, że poszczególne reguły mają pewną, hierarchiczną strukturę. Przyjmuje się, że pierwszeństwo w definiowaniu cech danego elementu czy też znacznika mają te reguły, które znajdują się najbliżej danego elementu. W myśl tej zasady najniższą hierarchie mają reguły zewnętrzne. Mogą być one modyfikowane przez reguły osadzone, które to natomiast przestają funkcjonować w momencie pojawienia się reguł wpisanych w dany znacznik.