tag.class 和 tag .class 有什么区别？

Question

有什么区别

tag.class 和 tag .class

或者

tag#id和tag #id？

Answer 1

tag.class匹配所有具有 nametag 和class 的元素class，例如：

div.foo { color: red; } 火柴 <div class="foo">

tag .class匹配所有.class的元素都是后人 的tag元素（注意之间的空间tag和.class）：

（请记住，“后代”包括所有孩子、他们的孩子等等——而相比之下，>（孩子选择器）只选择直系孩子而不是任何孙子。）

div .foo { color: red; }匹配<span>在<div><p><span class="foo">

tag#id和tag #id上面的类似，除了匹配id属性而不是class属性[1]

div#foo { color: red; } 火柴 <div id="foo">

div #foo { color: red; }匹配<span>在<div><p><span id="foo">

请记住，因为id=""属性是唯一的，所以额外的选择器可能是多余的，例如div#bar可以简化为#bar（除非您在#bar可能具有不同元素标签名称的不同页面上重用相同的 CSS 规则）。

[1]：这在 HTML 中是正确的，在使用 CSS 的其他 SGML 和 XML 语言中，.class和#id选择器可以映射到其他属性名称。