IDを使ってスタイルシート(CSS)を指定する

#固有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を記述し、スタイルシートを適用したいHTMLの要素の開始タグにそれと同じID名を指定します。

すると、その部分に対してスタイルシートを適用することが出来ます。

なお、CSSのID名の前には「#(シャープ)」を書く必要があります。

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

CSSを規格化するW3Cによれば、IDはそれぞれ固有の名前とし、HTML内で複数記述することは出来ないように定められています。

従って、HTML内で同じID名を使うことは出来ません。

ただし、現在の多くのWEBブラウザでは、同じID名を使っていても、特に問題なく表示されます。

CSS/HTMLサンプル

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

HTML
<p id=”sample”>…</p>

段落に特定のCSSを定義する サンプル

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

CSSを駆使したモダンなWebデザインを学ぶなら

最新情報をチェックしよう!