Question

所以，我对这个简单的事情感到有点困惑，我已经尽可能多地使用谷歌搜索了，但我只是不知道谷歌搜索它的正确关键词，我试过CSS选择器等，没有答案足以清除我的困惑。所以我也测试了，p.classname似乎甚至没有用，但根据我在阅读的书中的定义（2012年更新）

要在CSS中创建一个类并在该类中选择一个元素，请编写一个类选择器，如下所示：

p.classname{ stuff }

所以现在你有办法选择属于某个类的

元素他们的风格。

我找不到

的定义

classname p，但我自己会给出类似这个定义的内容“选择属于classname的所有p元素”，基本相同。

p.classname当我将“classname”给予一个仍然困惑的im时，我觉得我只是去perma使用.classname p，它起作用并且基本相同。

所以，请帮我解决这个困惑，我用谷歌搜索，我试图帮助这种混乱，但它没有用，它只是做了更多。

由于

Answer 1

所以当你这样做时

p.classname{
  ... 
}

您正在寻找<p>课程classname

当你做

时

.classname p

您正在寻找属于p类的后代的classname。

CSS .用作类名的选择器。

Answer 2

CSS通过按顺序阅读每个规则来工作，例如。

p {font-weight: bold;}

p span {font-weight:normal;}

<p>Hiya</p> // BOLD

<p><span>HIYA</span></p> // NORMAL

类

也是如此

.bold {font-weight: bold;}

span {font-weight:normal;}

<p class="bold">I AM BOLD <span>I AM NOT</span> BOLD AGAIN</p>

<p class="bold"><span> I AM ALL NORMAL</span></p>

因此，在您的示例中，首先定义class将首先定位具有该类的每个元素。

通过在该类.class p之后定义一些内容，它将定位该类中p的所有元素。

希望这有帮助

<强>更新

所以你可以更好地理解，

div {color: blue;}
div p {color: red;}
div p span {color: yellow;}
div ul {color: purple;}

<div>I AM BLUE <p>I AM RED <span> I AM YELLOW</span></p>I AM BLUE</div>

<p>I HAVE NO CSS ATTACHED TO ME</p>

<div><ul><li>I AM PURPLE</li></ul> I AM BLUE</div>

对于类而言，它与元素的作用完全相同。

Answer 3

我会这样解释，如果下面有以下CSS：

p.classname { stuff }

它仅将该类名称锁定为<p>标记。

因此，如果您将class="classname"放到其他任何地方，则除了<p>标记之外，它都无法使用。

p.classname或.classname p，有什么区别？

3 个答案: