HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


特定の要素にのみIDで指定する

CSS/HTMLの書き方

CSS
要素名#固有ID { プロパティ:値 ; プロパティ:値 ; …}

HTML
<要素名 id="固有ID">…</要素名>

CSSの詳細情報
対応ブラウザ Windows MAC
IE 5.0以上/FF1.0/NS7.1/OP8.0 SF/IE5.0
CSSレベル CSSレベル1

解説

特定の要素に対して、IDを使ってスタイルシートの適用する方法です。上記のように、「スタイルシートを適用したい要素名+CSSの固有のID」をCSSで記述し、それと同じHTMLの要素の開始タグにID名を指定します。すると、その要素に対してスタイルシートを適用することが出来ます。なお、CSSのID名の前には「#(シャープ)」を書く必要があります。

ただし、CSSで定義した要素にのみスタイルシートが適用されるので、それ以外の要素に同じID名を指定したとしても、書式は適用されません。

ID名は固有に割り当てること

CSSを規格化するW3Cによれば、IDはそれぞれ固有の名前とし、HTML内で複数記述することは出来ないように定められています。従って、HTML内で同じID名を使うことは出来ません。ただし、現在の多くのWEBブラウザでは、同じID名を使っていても、特に問題なく表示されます。

CSS/HTMLサンプル

CSS
p#sample { background:#ffdff9 ; width:50% ; font-size:small;}

HTML
<p id="sample">…</p>
<div id="sample">…</div>

特定の要素にCSSを定義する。
同じIDでもDIV要素にはスタイルシートは適用されない。 サンプル

次のページへ >>