Podstawy arkuszy stylów

Tworzenie stylów w HTML

Istnieją kilka sposobów umieszczania informacji o stylach...

Dołączanie stylu z zewnętrznego pliku

Jest kilka sposobów, za pomocą których można określać zewnętrzny styl (urządzenie odbiorcze, czyli np. przeglądarka, musi dawać czytelnikowi strony możliwość wyboru arkusza stylów; w przeciwnym razie nie ma alternatywy, co jest typową sytuacją - przyp. tłum.):

Zależność od docelowego typu mediów

Możesz ustalić oddzielne wartości domyślne dla różnych typów mediów, za pomocą oddzielnych poleceń <LINK href="stylesheetname.css" title="(your title or description)" rel="stylesheet" type="text/css2" media="mediatype"> dla poszczególnych typów mediów. LINK, który odnosi się do wszystkich innych typów, powinien być umieszczony na końcu, bez atrybutu media=.

Idź na stronę media, gdzie jest lista dostępnych wartości dla typów mediów.

Ogólna konstrukcja informacji o stylu CSS

Gdy informacja o stylu jest zawarta w tagu <STYLE> lub zewnętrznym pliku, stosuje się następującą konwencję :
  selector1,selector2,...,selectorn 
	{ 
	property1: value ;
	property2: value ;
	}   
Jest to lista elementów HTML, do których będą się odnosić style, po której znajduje się lista informacji o stylach, rozdzielonych średnikami (;) i ujętych w nawiasy klamrowe.

n.p. H1,H5 { color: blue}

Komentarze

Są one oznaczane za pomocą par znaczników /* ... */, znanych z języka C.
n.p. H1 { color: red } /* comments go here */

Dziedziczenie informacji o stylach

Jeśli jakiś znacznik nie ma przypisanej żadnej własności, a jest zawarty w ramach innej pary tagów, które mają przypisaną własność, dziedziczy wartość tego znacznika.
  <H1 style="color:green"> text <EM>moretext</EM> end of heading</H1>
Zakładając, że <EM> nie ma przypisanego gdzieś indziej koloru, "moretext" będzie wyświetlone w kolorze zielonym, gdyż znajduje się wewnątrz "zielonych" tagów <H1> </H1>. W ten sposób można przyjąć pewne wartości domyślne, przypisując je nadrzędnemu (najwyższemu w hierarchii) elementowi - BODY.

Pewne wartości mogą być podawane w procentach domyślnej wartości dziedziczonej, n.p. P { line-height: 120% }. Należy pamiętać, że elementy, które dziedziczą tę wartość, odziedziczą ją w postaci numerycznej, a nie procentowej.