如何取消CSS属性？

Question

我正在处理的页面附有许多不同的CSS文件,一个boostrap.css,master.css和一个custom.css文件.

我正在尝试删除一个属性,因为我不希望在菜单中的链接上有aa:hover属性.主CSS文件有

#topSurround a:hover {
    color: #ffffff;
}

引导程序CSS文件有

.nav > li > a:hover {
    text-decoration: none;
    background-color: #eee;
}

我不想编辑这些文件,因为它们是我正在使用的模板的核心文件,可以更新,所以我使用的是自定义CSS文件.通常,我会将该属性设置为默认值以覆盖该属性以前的任何使用.

#topSurround a:hover {
    color: none; (doesn't work, as this isn't the correct default)
}

那么,有两个问题:颜色属性的默认值是什么(似乎没有一个)？是否有更简单的方法来解决这个问题而不必覆盖核心文件？

Answer 1

您可以使用color: inherit颜色使用其祖先的值.color奇怪的是它根据上下文有不同的默认值.例如,链接通常默认为蓝色,而文本默认为黑色.

如果需要覆盖现有样式,请不要使用更具体的选择器.提高特异性意味着您只需在下次要覆盖它时使用更多选择器.

相反,通过使用具有相同特异性的选择器来利用级联,并使覆盖发生在原始样式之后:

/* older style in some library */
.foo .bar .baz {
    color: blue;
}

...in an overriding CSS file...

.foo .bar .baz {
    color: green;
}

Answer 2

要取消该属性，您可以使用unset关键字。

因此，在自定义 css 文件中，您可以执行以下操作：-

#topSurround a:hover {
    color: unset;
}

根据MDN网络文档：-

如果属性从其父级继承，则 unset CSS 关键字将其重置为其继承值；如果initial value不是从其父级继承，则将其重置为其继承值。换句话说，它的行为类似于inherit第一种情况下的关键字，以及initial第二种情况下的关键字。它可以应用于任何 CSS 属性，包括 CSS 简写 all。

Answer 3

最好的方法是制定更具体的 CSS规则,例如:

body #topSurround a:hover {
    color: transparent;
}

特性是一个重要的CSS概念,如本文所述:

http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/