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

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. 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.

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).