HOME

■外部スタイルシートの書き方■

今まで（ヘッダ内記述ＣＳＳ）の書き方と変わりません。ただし外部ファイルには内容だけ書けば済みます。 スタイル要素とコメントアウト文は書きません。

外部ファイル

body{
     background:#f9ffff;
}
p{
     font-size:1.1em;
     font-family:Osaka,'ＭＳ Ｐゴシック';
     line-height:130%;
}
img{
     border-width:0;
}

前ページ（ｗｒｃｓｓ１．ｈｔｍｌ）のプログラムと比べてみて下さい。 スタイル要素やコメントアウトがないだけで書き方は全く同じだとわかります。

メモ帳で書くことができます。ファイル名は「　some.css　」のように拡張子に「．ｃｓｓ」をつけて下さい。

■外部ファイルを読み込む要素ｌｉｎｋ

ｈｔｍｌファイルに直接スタイルシートのプログラムを書くかわりに、スタイルシート部分を「外部ファイル」として 読み込む（参照する）ことが出来るようになっています。

プログラム文

<link rel="stylesheet" media="screen,print" href="URI">

このｌｉｎｋ要素をヘッダ内に記述します。（用語の解説は「ヘッダについて」のページに後述。）

■補足

スタイルシート（特に外部ＣＳＳ）を使う場合は、色指定等デザイン部分は全てスタイルシートに任せる事を お奨めします。スタイルシート未対応ブラウザ（ネット上には実に様々なブラウズ環境があります）で閲覧した場合、 スタイルシートを使った部分は色づけされずに、ｂｏｄｙ内のデザイン付け要素（ｆｏｎｔ要素など）だけが反応して 見るも無惨な状態になります。中途半端な使用は良くないです。

| 「ホムペ作成」のインデックスに戻る | 次のページ（特定箇所にスタイルシートを効かせる）へ |