Question

我确定了需要更改的嵌入式样式。我无法找到它的到达位置或更改它所要针对的特定规则。

<div class="main-navigation-wrap main-navigation-sm d-lg-none is-active" style="top: 501px; height: 331px;">

这是我在inspect元素中查看时要覆盖的内容。

我想将顶部删除为0

我尝试过：

.main-navigation-wrap .main-navigation-sm .d-lg-none .is-active

{
top: 0!important; 

}

这：

.main-navigation-wrap .main-navigation-sm .d-lg-none .is-active          [style] {
top: 0!important;;
}

您可能会说我的CSS知识是有限的。请问如何定位和覆盖此内联样式。

Answer 1

您的第一个CSS规则示例很接近，但是由于所有这些类都属于同一个div，因此它们之间不能有空格。另外，通常来说，您希望在!important之前留一个空格，例如top: 0 !important;：

.main-navigation-wrap.main-navigation-sm.d-lg-none.is-active
{
    position: relative;
    top: 0!important; 
}

<div class="main-navigation-wrap main-navigation-sm d-lg-none is-active" style="top: 501px; height: 331px;">THIS DIV</div>

Answer 2

正如评论所说，由于添加！important，它将改变元素的内联样式。

之所以不是，是因为您指向一个不存在的元素。您的div有几个班级，您需要选择要更改的人。您的标记是不存在的组合。

在此处阅读MDN上的CSS组合