[1] [[HTML]] で[[外部スタイル・シート]]を使用するときには、
[CODE(HTMLe)[[[link]]]] 要素型の要素を使用します。

[2] 仕様書:
- [[HTML 4]]
-- 14.3.2 Specifying external style sheets
<IW:HTML4:"present/styles.html#specifying-external">
-- 14.4 Cascading style sheets
<IW:HTML4:"present/styles.html#idx-style_sheet-11">

[3] スタイル・シートにリンクする [CODE(HTMLe)[link]]
要素の属性は、次のようにします。 [SRC[HTML 4, 14.3.2]]

- [CODE(HTMLe)[[[href]]]] 属性: スタイル・シートの [[URI]] を指定します。
- [CODE(HTMLe)[[[type]]]] 属性: [[スタイル言語]]を指定すると、
[[UA]] が未対応のスタイル言語のスタイル・シートを入手する手間が省けます。
- スタイル・シートの種類を指定します。
-- [[持続スタイル]]:
[CODE(HTMLe)[[[rel]]]] 属性を [CODE(HTML)[[[stylesheet]]]]
とします。 [CODE(HTMLa)[[[ttile]]]] 属性は指定しません。
-- [[優先スタイル]]:
[CODE(HTMLe)[rel]] 属性を [CODE(HTML)[stylesheet]] とします。
[CODE(HTMLa)[title]] 属性にスタイル名を指定します。
-- [[代替スタイル]] (優先スタイルを除きます):
[CODE(HTMLe)[rel]] 属性を [CODE(HTML)[[[alternate stylesheet]]]]
とします。 [CODE(HTMLa)[title]] 属性にスタイル名を指定します。

[9] 優先スタイルを指定する [CODE(HTMLe)[link]] 要素が複数個あるときは、
[[文書順]]最初のものが有効です。 [SRC[HTML 4, 14.3.2]]

[4] [[UA]] は、利用者が代替スタイルの一覧を見て選ぶことができる方法を提供するべきです。
選択肢の名前としては [CODE(HTMLa)[title]] 属性値を推奨します。[SRC[HTML 4, 14.3.2]]

[[#comment]]

* 他との関係

[8] 著者は優先スタイルを指定するために [CODE(HTTP)[[[Default-Style]]]]
欄を使うことができます。 [SRC[HTML 4, 14.3.2]]

[CODE(HTTP)[Default-Style]] による指定は [CODE(HTMLe)[link]]
による指定より優先されます。 [SRC[HTML 4, 14.3.2]]

[10] 著者は[DFN[[RUBYB[段階][cascade]]]]を定義するために
[CODE(HTMLe)[[[link]]]] と [CODE(HTMLe)[[[style]]]] を任意個使用できます。
すべてのスタイル言語が[RUBYB[段階付け][cascading]]に対応しているわけではありませんが、
[[CSS]] のような対応している言語なら[[文書順]]に段階付けされます。 
[SRC[HTML 4, 14.4]]

対応していなかったらどうなのか HTML 4 仕様書には言及がありません。
スタイル言語依存でしょうか。 (というか HTML 側ではどうしようもないですね。)

異なるスタイル言語の混合の処理は未規定です。
著者は異なるスタイル言語を混合させるべきではありません。 [SRC[HTML 4, 14.3.2]]

[[#comment]]

* 例

[5] 持続スタイル・シートの例 [SRC[HTML 4, 14.3.2]]
[PRE(HTML)[
<LINK href="mystyle.css" rel="stylesheet" type="text/css">
]PRE]

[6] 優先スタイル・シートの例 [SRC[HTML 4, 14.3.2]]
[PRE(HTML)[
<LINK href="mystyle.css" title="compact" rel="stylesheet" type="text/css">
]PRE]

[7] 代替スタイル・シートの例 [SRC[HTML 4, 14.3.2]]
[PRE(HTML)[
<LINK href="mystyle.css" title="Medium" rel="alternate stylesheet" type="text/css">
]PRE]

[11] 代替スタイル・シート指定群の例 [SRC[HTML 4, 14.4]]
[PRE(HTML)[
<LINK rel="alternate stylesheet" title="compact" href="small-base.css" type="text/css">
<LINK rel="alternate stylesheet" title="compact" href="small-extras.css" type="text/css">
<LINK rel="alternate stylesheet" title="big print" href="bigprint.css" type="text/css">
<LINK rel="stylesheet" href="common.css" type="text/css">
]PRE]

この例では、利用者が [SAMP[compact]] スタイルを選択した時には
[SAMP(URI)[small-base.css]] と [SAMP(URI)[small-extras.css]] が、
[SAMP[big print]] スタイルを選択した時には [SAMP(URI)[bigprint.css]]
が適用されます。いずれの場合も、それに加えて [SAMP(URI)[common.css]]
が持続スタイルとして適用され続けます。

段階は [SAMP(URI)[small-base.css]] → [SAMP(URI)[small-extras.css]]
→ [SAMP(URI)[bigprint.css]] → [SAMP(URI)[common.css]]
の順になります。

[12] [CODE(HTMLe)[link]] と [CODE(HTMLe)[style]] を両方含む例 [SRC[HTML 4, 14.4]]
[PRE(HTML)[
<LINK rel="stylesheet" href="corporate.css" type="text/css">
<LINK rel="stylesheet" href="techreport.css" type="text/css">
<STYLE type="text/css">
    p.special { color: rgb(230, 100, 180) }
</STYLE>
]PRE]

この例では2つの外部持続スタイル・シートと1つの内部スタイル・シートが
(利用者が無効にしない限り) 常に適用されます。段階順は
[SAMP(URI)[corporate.css]] → [SAMP(URI)[techreport.css]]
→ [CODE(HTMLe)[style]] になります。

[[#comment]]

* メモ