Simple HTMLHTMLリファレンス

Main Menu

おすすめリンク

Site Info.

HTMLリファレンス

CSSリファレンス

その他の記事

CSSリファレンス インデックス

スポンサーリンク

CSSリファレンス

CSSの基本TOPCSSBasic

  1. CSSについてHTML文書におけるCSS(スタイルシート)の役割
  2. CSSの書き方ルールセット、セレクタ、宣言ブロック、ホワイトスペース

CSSの書き方

CSSルールセット

CSSの書き方はとてもシンプルで、セレクタ、プロパティ、値の3つの組合せが基本となります。前から順に「どの要素に」「どのスタイルを」「どう指定するか」記述します。

スタイルシートの書式

括弧で括られた部分は「宣言ブロック」と言います。ブロック内に記述するプロパティと値が「宣言」です。この「セレクタ」と「宣言ブロック」をまとめて「ルールセット」と呼びます。

例えば、最も簡単な記述では次のようになります。

h1 {font-weight:bold;}		<h1>要素に文字の太さ=太字を指定する
h2 {color:blue;}		<h2>要素に文字の色=青を指定する
p  {text-align:center;}		<p>要素にテキスト位置=中央寄せを指定する
セレクタ

ルールセットの最初に記述するのが「どの要素に」に該当する「セレクタ」です。 セレクタには後述する宣言ブロック内のスタイルを適用したい対象を記述します。対象には、要素名、属性名、属性値などを指定します。詳細はセレクタについての詳しい説明を参照してください。

セレクタのグループ化
<h2>の文字がセレクタ(スタイルを適用したい対象)
h2 {color:blue;}

セレクタはカンマで区切って何個でも記述できる
h1,h2,h3 {color:blue;}
宣言のグループ化
括弧で括られた内容が宣言を示す
h2 {color:blue;}

宣言はセミコロンで区切って何個でも記述できる
h2 {font-weight:bold; color:blue;}
スポンサーリンク
Copyright (C) 2010 Simple HTML. All Rights Reserved.