Czym jest CSS?

Podczas projektowania stron www wykorzystywane są różne narzędzia, techniki programowania i języki. Jednym z języków stosowanych w tym procesie jest język CSS. Co kryje się pod tym terminem i jak język ten wykorzystywany jest w praktyce?

Pojęcie CSS

CSS to skróty od angielskiego pojęcia Cascading Style Sheets, czyli kaskadowe arkusze stylów. Można je definiować jako język służący do opisu formy prezentacji stron www. Autorami kaskadowych arkuszy stylów byli specjaliści z organizacji W3C. Stworzyli je w 1996 roku. W praktyce decydują one o wyglądzie elementów strony – kolorystyce i wszystkich najdrobniejszych szczegółach kreacji strony. Poprzez zastosowanie kaskadowych arkuszy stylu możliwe jest pozycjonowanie elementów na stronie. Generalnie jednak, twórcy CSS mieli w zamyśle odseparowanie w pewien sposób struktury dokumentu od formy jego prezentacji. Warto dodać, że język CSS obsługiwany jest przez większość przeglądarek stron internetowych.

Arkusze CSS definiują między innymi wygląd:

  • Czcionek,
  • Tekstów,
  • Tła,
  • Marginesów,
  • Obramowania,
  • Filtrów,
  • Tabel.

Jeśli chodzi o wygląd czcionek, to w obrębie kaskadowych arkuszy stylów można ustalić ich wielkość, styl, proporcje czy rodzaj. Z kolei, przy tekstach cechy ustalane przez programistę dotyczą kolor, dekoracji, wcięcia, wyrównania czy cienia.

Korzyści z CSS

Kaskadowe arkusze stylów stały się nieodłącznym elementem projektowania stron www. Pozwalają one na bieżącą kontrolę przez programistę układu graficznego dokumentów, z poziomu jednego arkusza stylów i na kontrolę układu graficznego w sposób bardziej precyzyjny. Dzięki CSS można stosować różne układy graficzne, zależnie od typu urządzenia, z jakim mamy do czynienia.

Konstrukcja arkuszy

Kaskadowe arkusze stylów w języku programowania mają następującą postać:

(style type=”text/css”)

(! – –

Znacznik { właściwości: wartość; }

– – >

(/style)

W każdym arkuszu znajduje się lista reguł, ustalających precyzyjnie,  w jaki sposób elementy strony internetowej mają zostać wyświetlone przez przeglądarkę internetową. Każda reguła składa się z selektora i deklaracji, przy czym selektor określa grupę elementów, którego dotyczyć ma deklaracja, określająca formatowanie. Składa się ona z nazwy jednej z właściwości i jej wartości. Właściwością danego selektora może być np. kolor, a wartością – nazwa tego koloru – biały, niebieski, żółty, czerwony itd.

Aby arkusze były wykorzystywane w przypadku wyświetlania stron www, muszą zostać one powiązane z dokumentem. Należy określić przy tym relację witryny z dokumentem CSS przy użyciu linku:

<link rel=”stylesheet” href=”style.css” /> <!– wersja uniwersalna dla (X)HTML –>

Bądź:

<?xml-stylesheet type=”text/css” href=”style.css”?>

Ten ostatni link wykorzystywany jest dla dokumentów typu XML.

Link umieszczany jest we wnętrzu nagłówka dokumentu lub za pomocą elementu style, w dokumentach opierających się o XML.

Napisz komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *