 |
■ スタイルシートその前に３ 外部スタイルシート
ここでは、もう一つのスタイルシートの使い方である
"外部にスタイルシートを作りその中にスタイルを記述していく方法"とはどういうものかを
解説します。
この方法だと複数ページのレイアウトを統一することが簡単にできますし、管理する上でも一つの
スタイルシートで済むので便利です。
また、ページからレイアウトを指定したスタイルシートへリンクする事で、ページのレイアウトを統一
する事ができます。
(ページからスタイルシートへリンクする事を外部スタイルシートへのリンクと言います。)
図を使って説明すると・・・
|
 |
まず、スタイルシートに細かなレイアウトを指定したとします。
■ 背景の色・・ピンク
■ TDタグで書かれた文字に関して以下の様に設定
・文字の大きさ・・ピクセル指定で１４(１４ピクセル)
・文字の色・・赤
ページの状況
■ 背景の色・・標準（白色）
■ TDタグで書かれて文字に関する設定無し |
|
 |
ページからスタイルシートへリンクします。 |
|
 |
すると、スタイルシートで指定したレイアウトがページ側に
反映されます。 |
|
 |
また、背景や文字の大きさや色を変えたいと思った時に、
スタイルシートの設定を変えるだけで簡単に全てのページに
反映されるので手間が掛かりません。
スタイルシートで指定していたレイアウトを変更する。
■ 背景の色・・ピンク→黄色
■ TDタグで書かれた文字に関して以下の様に設定
・文字の大きさ・・ピクセル指定で１４→１２
・文字の色・・赤→黒
スタイルシートで変更した設定がページに反映。 |
(※注 スタイルシートはテキストファイルなので、図の中で示した様に色が見えるわけではありません。
実際には背景や文字の色を指定するHTML(プログラミング言語)が書かれています。図の中では
分かりやすくする為に色を付けています。)
上記の解説はスタイルシートとページの関係を分かり易くする為にかなり簡単な解説にしています。
いろんなサイトや本に書かれているスタイルシートの説明で、意外と分からないのがこのスタイルシートと
ページの関係で、ホームページ初心者には特に分かりづらいと思います。私も最初は困りました。
外部スタイルシートにデメリットはありません。ホームページビルダーのヘルプでは、ページとは別に
管理しなければならない事がデメリットとして挙げられてますが、私は不便に感じた事はないです。
|
