先日からレイザーサーモンさんから質問を受けていてスタイルシートの基本的な説明が欠けているとかんじました。
そこでスタイルシートの概要だけでも説明したいと思います。
スタイルシート（別名ＣＳＳ）はデザインを記述する言語です。ホームページのHTMLと一緒に使います。ページを記述するにはＨＴＭＬだけでもよいのですが、このスタイルシートを使用するとデザインを一括管理できます。
ブログの記事の「タイトル」はこのフォントで、「日付」の背景はこの色で、「左バーのブロック」の枠はこの色でという具合に決めていきます。上記の「タイトル」「日付」「左バーのブロック」などはページに複数ありますよね。それを一括で指定できるのがスタイルシートです。
上記の例でいう「タイトル」「日付」「左バーのブロック」などはHTMLとＣＳＳを関連付けるキーワードなのでどちらのファイルにも指定しておかねばなりません。この関連付けるキーワードをセレクタといいます。例では分かりやすく「タイトル」「日付」「左バーのブロック」のように書きましたが通常このキーワード「セレクタ」は英数字で指定します。スタイルシートではこのセレクタに対してフォント、位置、色などのデザイン情報を書いていきます。
ブログ等の場合このセレクタが事前にＨＴＭＬの中に埋め込まれており、そのセレクタ名がどこに作用しているのかを知ることが必要です。当ツールの赤枠表示はそれを知るためのツールです。セレクタがどこに作用しているのかが分かれば、どこのデザインでも変更することができます。でも説明したとおりあるセレクタのデザインを変えたら、そのセレクタに関係する場所は全てデザインが変更になります。
分からないことがあればどんどん聞いてくださいね。
