Html 关于.captain.picard*#riker对CSS的含义的信息

我想知道皮卡德船长是什么意思。我很确定这意味着任何类为“captain picard”的HTML元素（例如一个div）都选择了其中的所有内容，然后在选择的所有内容中，所有id为“riker”的HTML元素都被选择并设置样式。例如：

<div class="captain picard">
  <p id="riker">One</p>
  <p id="pikespeak">Two</p>
  <p id="peakout">Three</p>
</div>

.captain.picard * #riker {
  color: red;
}

一个
两个

三个

.皮卡德船长*#里克{
颜色：红色；
}

---

那么单词One应该是红色的，对吗？没有发生。我不明白为什么这是。。。如果我去掉#riker选择器，那么所有标签单词的样式都是红色的，这是完全有意义的。有人能帮忙吗？

您必须删除*，因为它代表的是类元素和id元素之间的每个可能元素

您必须删除*，因为它代表的是类元素和id元素之间的每个可能元素

我很确定这意味着任何类为“captain picard”的HTML元素（例如一个div）都选择了其中的所有内容，然后在选择的所有内容中，所有id为“riker”的HTML元素都被选择并设置样式

这可能是

.captain.picard*#riker

（注意

*

后面的空格被省略），也可能是

.captain.picard.#riker

用空格分隔

*

和id选择器表示两个不同的元素，其中

*

是祖先元素。将其添加到

.captain.picard

（及其后代组合器）中，您有三个嵌套级别，这与此处的结构不匹配

我很确定这意味着任何类为“captain picard”的HTML元素（例如一个div）都选择了其中的所有内容，然后在选择的所有内容中，所有id为“riker”的HTML元素都被选择并设置样式

这可能是

.captain.picard*#riker

（注意

*

后面的空格被省略），也可能是

.captain.picard.#riker

---

用空格分隔

*

和id选择器表示两个不同的元素，其中

*

是祖先元素。将其添加到

.captain.picard

（及其后代组合符）中，您有三个嵌套级别，这与此处的结构不匹配。

只需删除*，这意味着“所有元素”。看看它是怎么工作的

.captain.picard#riker{
颜色：红色；
}
.皮卡德船长2*{
颜色：蓝色；
}

一个
两个

三个

一个
两个

三个

只需删除*，这意味着“所有元素”。看看它是怎么工作的

.captain.picard#riker{
颜色：红色；
}
.皮卡德船长2*{
颜色：蓝色；
}

一个
两个

三个

一个
两个

三个

如果您只想设置一个不需要使用的div项的样式，那么好吧*

简单使用

  .captain  #riker {
  color: red;
  }

一个类选择器就可以了

.picard  #riker {
 color: red;
  }

我也会这么做

但是如果你想选择captain类下的所有元素，那么你可以使用* 比如说

.captain  * {
color: green;

---

}

如果只想设置一个不需要使用的div项的样式，那么让我们明确一下*

简单使用

  .captain  #riker {
  color: red;
  }

一个类选择器就可以了

.picard  #riker {
 color: red;
  }

我也会这么做

但是如果你想选择captain类下的所有元素，那么你可以使用* 比如说

.captain  * {
color: green;

}

通过使用这样的类 .captain.picard#riker您所说的可以在课堂上完成。captain.picard“所有带有#riker”的id都会根据给定的样式进行更改

.captain.picard#riker{
颜色：红色；
}

一个
两个

三个

四个

使用这样的类 .captain.picard#riker您所说的可以在课堂上完成。captain.picard“所有带有#riker”的id都会根据给定的样式进行更改

.captain.picard#riker{
颜色：红色；
}

一个
两个

三个

四个

您的代码：

<div class="captain picard">
  <p id="riker">One</p>
  <p id="pikespeak">Two</p>
  <p id="peakout">Three</p>
</div>

一个
两个

三个

您的代码：

<div class="captain picard">
  <p id="riker">One</p>
  <p id="pikespeak">Two</p>
  <p id="peakout">Three</p>
</div>

一个
两个

三个

为什么要使用

*

？有什么具体情况吗？你也可以直接瞄准，而不必那样

captain.picard#riker{color:red}

the*表示“每个元素”，所以如果您只选择“riker one”，则不必这样说。@Deepak Yadav：阅读第一段。我同意您的观点，这是非常不切实际的，但这是一个HTML练习，假设无法修改该选择器，那么它实际上会选择什么？为什么要使用

*

？有什么具体情况吗？你也可以直接瞄准，而不必那样

captain.picard#riker{color:red}

the*表示“每个元素”，所以如果您只选择了#riker one，则不必这样写。@Deepak Yadav：阅读第一段。我同意您的观点，这是非常不切实际的，但这是一个HTML练习，假设选择器无法修改，那么它实际上会选择什么？