本来 HTML 4 には複数の CSS を切り替える仕組みが用意されています。これによって、閲覧する側で自分の好みの表示にすることができます。 Netscape 6 や Mozila はこの仕組みに対応していて、Netscap 6 はメニューから切り替えることができます（Mozila は未確認です）。 今回は標準のスタイルのほかに、2つのスタイルを用意してみました。
01 <LINK rel="stylesheet" type="text/css" href="../../../base.css">
02 <LINK rel="stylesheet" title="simple" type="text/css" href="simple.css">
03 <LINK rel="alternate stylesheet" title="red & yellow" type="text/css" href="red_yellow.css">
04 <LINK rel="alternate stylesheet" title="blue" type="text/css" href="blue.css">
最も基本的な外部スタイルシートを参照する方法です。
外部のスタイル定義ファイルを参照するときには LINK タグを使用します。そして、属性 rel の値として
stylesheet を指定します。これによって、参照しているものがスタイル定義ファイルであることがわかります。そして、
type 属性の値を text/css にします。これはファイルが CSS
の定義ファイルであることを示しています。最後に、href 属性によって参照するファイルを指定します。
ファイルは相対パスか絶対パスでの指定になります。
このような参照の仕方をした場合、スタイルシートが有効である限りそのスタイルは常に使用され、メニューに表示されることはありません。
L01のものに title 属性が追加されたもので、値はメニューに表示されます。
このスタイルは優先的に使用され、ページが読み込まれた直後の段階で自動的に選択されます。
なお、同じ値の title 属性をもつ LINK タグが複数あった場合、そのすべてが1つのグループとして扱われます。
L02の形で、rel 属性の値が alternate stylesheet に変わったものです。 この方法で参照されたスタイル定義は、標準の状態では使用されませんが、閲覧者が選択することで一時的に使用されるようになります。 L02と同様、同じ値の title 属性をもつ LINK タグは同じグループとして扱われます。