仅当具有特定类的子项时才选择元素

Question

我有这个标记：

<div class="container page-content">

</div>

通常，课程页面内容有一个填充：

.container.page-content{
    padding-top: 160px;
}

但在特定页面上有一个类＆＃34; item-pagehome＆＃34;在我的div里面：

<div class="container page-content">
   <div class="item-pagehome">
     Some Content ... 
   </div>
</div>

在这种特殊情况下，我想禁用.page-content的填充顶部。但是我怎么能这样做呢？

我尝试选择：

.page-content:has(> .item-pagehome){
   padding-top: 0px;
}

但这不起作用......

  

如果div是特定的子类，我该怎么选择div呢？   case .item-pagehome？

Answer 1

.container.page-content .item-pagehome {
    margin-top: -160px;
}

Answer 2

使用CSS无法完成。

CSS是层叠样式表（级联：从上到下）。您只能影响CSS选择器中的最后一个元素。

您正在寻找的条件可以使用JavaScript完成，但这不在您的问题范围内。