HOME

■スタイルシートでｃｌａｓｓとｉｄを使うと■

スタイルシートは１つの指定でページ全体に同じ効果をかけられるので便利ですが、逆にそれがネックになるときがあります。 それは、ある部分だけを強調したい時や一部分だけを他の同要素と違うものにしたい時です。 このような時にｃｌａｓｓとｉｄ属性を使います。

・ｃｌａｓｓ属性は１ページ（一つのファイル）で何度でも使えます。

・ｉｄ属性は１ページに１回だけしか使えません。

■ｃｌａｓｓ属性の書き方

要素の属性値としてタグ内に加えます。ダブルクォーテーションの中は任意かつユニークな半角英数文字。

ｈｔｍｌプログラム文（ｃｌａｓｓ属性）

<p class="any1">ハロ〜ワールド</p>

スタイルシートにｃｌａｓｓ属性を使うことを命令するときは、要素名の後に、「．（ドット）」と 「ｈｔｍｌ文内で属性値に使った文字列」を追加します。

ＣＳＳプログラム文（ｃｌａｓｓ属性）

p.any1{
      属性:値;
      属性:値;
      属性:値;
}

■ｉｄ属性の書き方

要素の属性値としてタグ内に加えます。ダブルクォーテーションの中は任意かつユニークな半角英数文字。

ｈｔｍｌプログラム文（ｉｄ属性）

<p id="something">ハロ〜ワールド</p>

スタイルシートにｃｌａｓｓ属性を使うことを命令するときは、要素名の後に、「＃（シャープ）」と 「ｈｔｍｌ文内で属性値に使った文字列」を追加します。

ＣＳＳプログラム文（ｉｄ属性）

p#something{
      属性:値;
      属性:値;
      属性:値;
}

ＣＳＳを使う場合の注意点として、ＣＳＳ中で一番最後に指定しないと、まんいち 同一タグを後から指定したりすることで効果が得られない事があります。外部スタイルシートで スタイル付けをしている場合には特に注意が必要です。

テスト：このパラグラフはｉｄでスタイル付けをしています。 与えた効果を判りやすくするためにこのパラグラフの分のスタイルシートだけはこのファイルのソースに直書きしてあります。

| 「ホムペ作成」のインデックスに戻る | 次のページ（ヘッダ要素の書き方）へ |