- ベストアンサー
CSSで、 #hoge と、 div#hoge の違いは？
CSSのID属性の指定で、#hoge と、 div#hoge のように参考書によって二通り見かけるのですが、これの違いはあるのでしょうか？
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
#hoge {…} div#hoge {…} の違いですよね？ 前者はid="hoge"を持つ全ての要素に適用され、 後者はid="hoge"を持つ<div>要素に適用される、 と、いうことになります。 ただし、idはページ内で重複してはいけない事になっているのでid="hoge"を持つ要素も一個のはず。なので普通に考えたらどちらを使っても同じになると思います。 こういう使い方を必要とするケースがあるかどうかわかりませんが、スタイルシートを外部ファイル化し、あるページでは<div>、他のあるページでは<p>にid="hoge"と付けるようなケースでは前者と後者で違いがでます。 また、カスケード処理においてはページ内に書いた場合でも他の指定との絡みで違いが出てくる場合があるかもしれません。 （この辺は自身も知識もないので詳しくはパス。→参考URL）
その他の回答 (3)
- steel_gray
- ベストアンサー率66% (1052/1578)
> 同じページで<p id="hoge">、<div id="hoge">を両方とも使うのはNGで、 Ｙｅｓ！ > ページが違えばよいということでしょうか。 Ｙｅｓ！！
- steel_gray
- ベストアンサー率66% (1052/1578)
>div#hoge {…} と書いた場合、でid要素はいっかいだけだけども、 #hoge {…} で他のところで divのところでなければ使ってよいということになるんでしょうか？ 正確に把握できていないんですが他のところとは他のページって事ですよね？ で、あれば #hoge {…} というスタイルを書いて、ページごとに <p id="hoge">、<div id="hoge">、<body id="hoge"> など、別の要素に適用させるのはOKです。 IDの場合こうした使い方はちょっと思いつきませんが、 classの場合は要素を特定しない使い方はありそうですね。 例・・・段落全体のフォントサイズを小さくし、さらに一部を小さくする。 .Hosoku{font-size:80%;} <p class="Hosoku">IDはページ内で重複してはいけません。<em class="Hosoku">しかし、別のページ同じIDを別の要素につけるのはかまいません。</em></p>
お礼
いろいろとありがとうございます。 たびたびすみません、お礼と、最終の確認です。 ということは、同じページで<p id="hoge">、<div id="hoge">を両方とも使うのはNGで、ページが違えばよいということでしょうか。
- JeanneNet
- ベストアンサー率48% (100/208)
こんにちは、じゃんぬねっと です。 #hoge p { } と p#hoge { } の違い、という意味ですかね? 前者は、hoge という ID にマークアップされた P 要素にすべて適用されます。 後者は P 要素でかつ ID が hoge のものにだけ適用されます。 # 相変わらず、説明下手だなぁ > あたし
補足
ということは、スタイルシートは外部からリンクをはって使う場合なんですが、 div#hoge {…} と書いた場合、でid要素はいっかいだけだけども、 #hoge {…} で他のところで divのところでなければ使ってよいということになるんでしょうか？ なんか、屁理屈みたいな質問でごめんなさい（苦笑）！