Html CSS文件中空格的使用

这是一个最基本的问题，但我心里不清楚，所以我想问：

假设您有一些基本的HTML，如下所示：

<div class="a">
    <p class="b">something</p>
    <img class="b">
    <p class="c">something</p>
</div>

如何使用CSS选择第一个元素

我感到困惑的原因是，到目前为止，我认为CSS可以通过指定类型和类来工作，但似乎我做不到。所以我可以有类似的东西：div p或div.b或.a p或.a.b，但不是像我所相信的那样div.a p.b，以及每个浏览器工具如何命名像div.a p.b这样的元素

所有这些问题都是因为类和类型之间的空格吗？

尝试以下方法：

.a .b { color:red; }

或者，即使在较旧的浏览器中可能不起作用：

.a p:first-child { color:red; }

如果要使用img.className之类的元素名称，则元素名称与其类或id名称之间不能有空格。空格被用作分隔符，其行为有点像目录树：.a.b p{color:red；}是将.b中的所有段落的红色表示为.a中的红色的同义词

你需要做什么

div.a p.b 

你在干什么

div .a p .b

---

is：获取b类元素，查看哪些元素在p中，哪些元素在a类元素中，哪些元素在div中。

这些应该都可以

div :first-child             //first child of a div

p:first-child                //first p

div p:first-child            //first p child of a div

.a p:first-child             //first p child of class .a

div p.b                      //p's with class .b as decedents of div

.a p.b                       //p's with class .b as decedents of class .a

没有空格，因为在p.b中，所有p都将引用class.b

用空格，如在p.b中，将引用p的b类死者

所有这些问题都是因为类和类型之间的空间吗

是的，一个空格就是一个空格

a、 b指a类和b类元素

---

a.b表示a*。b表示任何类型的元素，b类元素是a类型元素的后代。

基本上是的，这是因为空间。因此，可通过以下方式选择b类段落：

.a .b {
/* Rules */
}

或者更具体地说：

div.a p.b {
    /* Rules */
}

而第二条规则只选择类为b的任何p元素，该元素位于类为a的div中。第一个选择在任何具有类a的元素中选择任何具有类b的元素