CSS类优先级

Question

我有两个类，一个专门用于某些标签，另一个可用于任何标签：

a.action_link_2 {
    display:inline-block;
}

.display_none {
    display:none;
}

在某些情况下，我想要应用这两种风格，并试过这个：

<a class="action_link display_none">content</a>

但是，在浏览器中呈现时，'action_link'类优先。我知道这可能与CSS类优先级有关，即特定于标记的类优先。我的问题是如何使用这些类隐藏这个标签，并且仍允许在任何元素上使用'display_none'类来隐藏它？

Answer 1

你可以在课前删除a，并在display none class之前添加body，以赋予它更高的优先级。

.action_link_2 {
    display:inline-block;
}

body .display_none {
    display:none;
}

Answer 2

你是对的，因为特异性读this

  

要克服这个问题，你需要增加特异性   {/ 1}}类，当它出现在action_link_2上时。

只需添加一条规则，就在所有规则的下方

.display_none

  

这样可以，但是当你尝试添加类时会出现问题   a.display_none { display:none; } 到.display_none，但没有anchor类   本。

所以最终和最好的解决方案是使用：

.action_link_2

Answer 3

你可以试试这个：

.display_none { display:none !important; }