Question

我有一个关于这种风格的CSS（风格是用LESS写的）问题：

#someId .someClass ul li.active a {
    color: #6B007D !important;
}

每次输入链接时，页面都会重新加载，而它的父级li会获得class =“active”（它是唯一的类）。根据设计，li元素没有类。

<div id="someId">
...
<div class="someClass">
....
    <li>
        <a href="somelink.htm">Something</a>
    </li>
....
</div>
....
</div>

当我在开发者工具（Chrome和Firefox）中检查没有“活动”类的li时，它指出具有“活动”类的样式无论如何都会生效。为什么会这样？如何预防？

PS。！important是遗留代码，而不是我的设计选择。

问题解决了，问题无法解答 我重写了添加了css类的脚本，因此没有空的li元素。如果它不活动则会获得“非活动”类。它实际上适用于这个问题，但我不想将其作为答案添加，因为我想了解实际发生的事情？

Answer 1

该样式不是来自您的CSS，它是一种应用于任何锚元素的浏览器默认样式。你可以在这里找到相同的css。

颜色＃6B007D与当前应用于锚文本的颜色不同。您可以在示例中的锚文本下方看到颜色为＃6B007D的文本。

＆＃13;

<li>
    <a href="somelink.htm">Something</a>
</li>

<p style="color: #6B007D">Text in color: #6B007D</p>

＆＃13;

Answer 2

这使得<a>紫色（通过CSS）：

<div id="someId">
    <div class="someClass">
        <ul>
            <li class="active">
              <a href="somelink.htm">Something</a>
            </li>
        </ul>
   </div>
</div>

这不是（是否有.active类：

<ul>
  <li class="active">
    <a href="somelink.htm">Something</a>
  </li>
</ul>

区别在于第一个是由CSS中提到的特定选择器包装的：#someId .someClass

对于sbeliv01来说，如果它是紫色而没有围绕它的那些选择器，或者没有.active，那么你只是看到了:visited的默认浏览器样式。

虽然html元素没有某个类

2 个答案: