Cascading Style Sheet

Part 1

ここでは、CSS(Cascading Style Sheet)を用いたこのページの解説をします。

まず、CSSをHTMLに組み込む方法として、次の3つの方法があります。

1.「LINK」要素で外部スタイルシートを組み込む


<HEAD> -- </HEAD>内に次のように記述し、style.cssを呼び込む方法です。

<META http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="style.css" type="text/css">

その際、別途CSSファイルを用意しておく必要がありますが、この方法の利点として、複数のHTMLファイルでスタイルを共有出来ることが言えます。 尚、CSSファイルを読み込まない場合、 このように見えます。 つまり、CSSに対応してないブラウザでも、文章のHTMLによる構造は伝わる訳です。しかし、IE3.02やNN4.xなどでは、誤ってCSSを解釈している部分もあり、きちんと表示されない場合があります。 (c.f.Consideration for any Browser

2.「STYLE」要素の中にスタイル情報を埋め込む


<HEAD> -- </HEAD>内に先のCSSファイルを直接書く方法です。

<STYLE type="text/css">
<!--(ここにCSSファイルの内容を書きます。)-->
</STYLE>

3.「style」属性を利用してスタイル情報を組み込む


タグに直接スタイル属性を付加する方法です。例えば、次のようにします。

<H4 STYLE="color: green; font-size: 16pt; text-align: center;">インラインのスタイル指定</H4>

これをそのまま表示させると次のようになります。

インラインのスタイル指定

Part 1 | Part 2 | Part 3 | Part 4 | Part 5 | Part 6 | Part 7


top up index new search mail