Dołączanie do zewnętrznego arkusza stylów

[ aktualizacja 20.12.2000 ]

Każdą stronę można dołączyć do zewnętrznego arkusza stylów, w którym są zdefiniowane własności różnych elementów - interpretują to polecenie Internet Explorer 4 i 5, Netscape 6 i Opera 5. Na przykład, strony opisujące oprogramowanie internetowe w Narzędziach internetowych (w serwisie Wydawnictwa Lupus) są dołączane do zewnętrznego arkusza o nazwie toolstyl.css (rozszerzenie .css), umieszczonego na serwerze. Arkusz został zapisany następująco:


<HTML>
<STYLE TYPE="text/css">
<!--

BODY {text-align: justify; margin-left: 1cm; margin-right: 1cm; margin-top: 1cm}
P {font-family: "Arial CE", Arial, Helvetica; font-size: 10pt; font-weight: normal; text-indent: 3 em}
A {text-decoration: none; color: blue}
H1 {font-size: 24pt}
H2 {font-size: 20pt}
H3 {font-size: 16pt}
H1, H2, H3 {font-family: "Arial CE", Arial, Helvetica; font-weight: bold; color: #808000}
TD {font-family: "Arial CE", Arial, Helvetica; font-size: 10pt; font-weight: normal}
LI {font-family: "Arial CE", Arial, Helvetica; font-size: 10pt; font-weight: normal}

-->
</STYLE>
</HTML>


Przykładowo, artykuł opisujący edytor Pajączek zawiera następującą część nagłówkową:


<head>
<title>Pajączek 2.0</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
<meta http-equiv="author" content="Paweł Wimmer">
<meta http-equiv="authoring tool" content="HomeSite">
<meta http-equiv="distribution" content="global">
<meta http-equiv="resource-type" content="document">
<LINK REL=stylesheet HREF="../style/toolstyl.css" TYPE="text/css">
</head>


Proszę zwrócić uwagę na wiersz (niebieski) zawierający odniesienie do arkusza. Jest on umieszczany w ramach części nagłówkowej (HEAD) i ma ściśle określoną składnię. HREF wskazuje ścieżkę do katalogu, w którym jest umieszczony arkusz. Może on być, oczywiście, ulokowany w tym samym folderze, co strony zawierające odniesienie do niego. Wszystkie definicje zewnętrzego arkusza stylów są automatycznie przyjmowane przez elementy danej strony.

W niniejszym dokumencie został użyty zewnętrzny arkusz wykorzystywany w Webmasterze - artykuly.css

Stosowanie zewnętrznego arkusza ma tę zaletę, że nie jest konieczne wprowadzanie stylów na konkretnej stronie, zmniejszamy objętość plików, a także możemy za pomocą zmiany jednego parametru w arkuszu stylów zmienić wygląd wszystkich stron, które się odwołują do tego arkusza (np. kolor tytułu czy wielkość czcionki akapitów).