このタグの違い教えてください！

質問

http://msugai.fc2web.com/web/CSS/selector.html
↑こちらのサイトの「クラスセレクタ」に記載されている例なのですが、

p.note { font-style: italic }・・・(1)
.note { text-decoratoin: underline }・・・(2)
の違いがわかりません。

考えてみたのですが
(1)はnoteというclass属性を持つp要素に対してfont-style: italicを適用する
(<p></p>←のようにnoteを持たない<p>タグには適用されない)

(2)（p要素に限定せず、）noteというclass属性が与えられているすべての要素に
text-decoratoin: underlineを適用する。
で合っているでしょうか？

よろしくお願いいたします。

回答No.4

noname#158634 · ベストアンサー

屁理屈なんかより正しいかどうかを知りたくて投稿したんですよね。なので以下答えのみ。

＞(1)はnoteというclass属性を持つp要素に対してfont-style: italicを適用する
＞(<p></p>←のようにnoteを持たない<p>タグには適用されない)
＞(2)（p要素に限定せず、）noteというclass属性が与えられているすべての要素に
＞text-decoratoin: underlineを適用する。
(1)の括弧内が厳密には違います。「p要素以外のclass="note"」にも適用されません。
あとは合っています。

以上です。

お礼

＞屁理屈なんかより正しいかどうかを知りたくて投稿したんですよね。
質問の意図をご理解いただきまして、ありがとうございます☆
＞「p要素以外のclass="note"」にも適用されません
理解できました。
ご回答いただきまして、助かりました。
ありがとうございました。

回答No.3

ORUKA1951

現在標準のCSS2.1では、次のように解釈します。基本的には.noteとい書き方はしません。(CSS1との後方互換のためです。)
p.noteと言うセレクタは、基点となるセレクタにpというタイプセレクタに、クラスセレクタ.で、対象HTMLの要素(CSSではタイプ)のclass属性の値に空白で仕切られた値のリストのひとつにnoteをもつもの・・と言う意味になります。
<p class="note"><p class="memo note">のいずれにも適用されます。
　こりとき、詳細度は b=1,d=1ですから、0,0,1,1--11と考えても良い--になります。

.noteは、CSS2.1では、*.note と言う意味に解釈します。*は全称セレクタと呼ばれるもので詳細度は0です。
　すべてのタイプ(HTMLではタグ)で、class値内にnoteを持つものです。
<div class="section note"><p class="note">などに適合します。詳細度は全称セレクタは0なので{0,0,1,0}--10ですから、出現順番に関わらず、p.classのほうが詳細度が大きいので上書きできません。

p.note {color:red}
.note {color:green}
と書けばわかります。

セレクタの書き方とカスケーディングはスタイルシートのもっとも大事なところですから、必ず目を通して起きましょう。とは言ってもCSS2.1の邦訳はないので、CSS2のものをあげておきます。
セレクタ ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html#toc )
値の割り当て、カスケード処理、継承 ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html#toc )

　仕様書に書かれていることは聞かなくて済むはずです。それでもわからないときは質問するというスタンスを忘れないように。
　この様な掲示板では、そのごく一部しか説明はされませんから、間違った知識を持ってしまう可能性がありますからね。

お礼

ご紹介いただいたサイトは質問する前から何度も見させていただいているのですが、
なかなか理解できず。。。
まずは、ORUKA1951さんのお言葉を理解できるようになることを目指したいと思います。
ご回答いただきましてありがとうございました。

回答No.2

lupin-333333

あるいは、こちらの参考URL

http://search.yahoo.co.jp/search?p=HTML%20%E8%A7%A3%E8%AA%AC%20%E3%82%AF%E3%83%A9%E3%82%B9%E3%82%BB%E3%83%AC%E3%82%AF%E3%82%BF&sp=1&n=10&ei=UTF-8&fr=ie8sc&SpellState=

これらで理解できないのなら、HTMLの取得はやめることを推奨します。

お礼

追記ありがとうございます。
参考にさせていただきます。

回答No.1

lupin-333333

この問題も、

何度も何度も投稿されている内容ですね。そっくりです。

この程度の問題は、自分で本買って勉強しなさい。

参考URL

http://msdn.microsoft.com/en-us/library/aa358816(v=VS.85).aspx

http://msdn.microsoft.com/en-us/library/aa770068(v=VS.85).aspx

http://www.microsofttranslator.com/BV.aspx?ref=IE8Activity&a=http%3A%2F%2Fmsdn.microsoft.com%2Fen-us%2Flibrary%2Faa358820%28v%3DVS.85%29.aspx
（上記URL翻訳サイト使用）

ただし、これらはブラウザがどのように実装したかですので、規定どおり動作しない、するは存在します。

お礼

ご回答いただき、ありがとうございました。