css - 使用属性在上面选择了一个 div

Question

我想编辑我的购物车页面上内容 div 中的“p”内容。

由于内容 div 出现在每个页面上，我不想只使用“内容 + p”

是否有一个我可以使用的属性将“选择购物车模块上方的 div 中的所有 p 标签”

 <div class="content">
   <p>The content I want to edit<./p>

<div class="cart-module">
<div class="cart-total">

此外，是否存在属性规则导致页面变慢的问题？

Answer 1

如果结构总是如您在问题中描述的那样，那么您可以使用第一个子选择器:

.content > p:first-child { 
    background-color: red;
}

只有当 p 位于内容的第一位时，才会获取内容中的 p。

关于您的第二个问题，它始终取决于您在每个页面上使用的属性的数量和数量。属性选择器比 id 或类慢，因为后者被浏览器索引，正是出于这个原因。无论如何，如果您不大量使用它们，您肯定不会注意到其中的区别。

当然，如果您有权修改 html 结构，最简单的方法是向要选择的 p 标签添加一个类...