スタイルを記述する場所

style属性の値として記述する

「プロパティ: 値」 というスタイルの設定を記述 する方法は3とおりあります。 HTMLの知誌が あれば、一番わかりやすいのほ、スタイルを設 定したい要素に、 style属性を綾定する方法で、 [style=” プロパティ: 値 “] のように [“] または 円を付けて記述します。

headタグ肉に記述する

1 つの H T M L文書内に共通するスタイルは、 h e a d 部分に style タグを用いて指定します。ま ず、 s t y l e タ グ の t y p e 属 性 に [” t e x V c s s “] を 設 定 します。これはスタイルシートの種類が css であることを表しています。スタイル設定対 象を指定するものを「セレクタ」といいますが、 同ーのタグすべてにスタイルを設定したいとき は、タグ名をそのままセレクタとして用います。 たとえば、 h1 タグにスタイルを設定したいとき は[h1] を記述し、 [n] で囲んで「プロパティ: 値」を記述します( セレクタについては P 5 2降を参照 )。なお、この記述方法を採ると、 css に対応していないブラウザではスタイル 指定の文字列がそのままブラウザに表示されて しまうので、それを防ぐためにスタイル指定の 部分を [<!ー「」->]でコメント化しておくの一般的です。

拡張子 「.css」のファイルを作成する

スタイルを設定するファイル( 外部スタイル シート) を別途作成し、その設定情報を H T M L 文書から呼び出すようにすることもできます。 この方法を採れば、複数の H T M L文書に共通の スタイルを設定することが容易にできるように なります。 外部スタイルシートファイルは、スタイル設定 情報を記述し、拡張子を 「.css」 で保存します。 ここでは例として、 h1 要素に 、 「background color:yellow」を設定し、 「style.css」 という名 前で保存するものとします。

次に、呼び出す側のHTML文書では、 head内に link タグを用いて、右のように記述します。「rel=”stylesheet”」ではスタイルシートを使う ことを宣言し、「type=”text/css”」 でスタイル シートの種類が css であることを示します。 「href=”ファイルへのパス“」 という形でスタイ ルシートファイルを読み込ませます。この例で は、スタイルシートファイル 「style.css」 H T M L文書と同一階層に置いた場合を示してい ます。

スタイルが設定される

タグで 指定した見出しの背景色を黄色に設定できま す。