如何在CSS样式表中使用条件格式？

Question

我希望为IE 9使用一些条件样式 - 但我希望在我的主样式表中包含条件 - 不使用第二个样式表或在HTML页面中引用它.目前,我将此代码放在HTML页面中,因为它会覆盖主样式表中的其他样式:

<!--[if IE 9]>
<style>
nav li a:hover {
    text-decoration: underline;
    color: black;
}
nav .four a:hover{
    color:white;
}
</style>
<![endif]-->

但是我想在CSS表格中有这些条件,所以它们都位于一个地方,我不必在每个页面重复这些代码.我还宁愿避免为IE 9单独使用CSS - 我已经有一个用于IE 7-8.我在样式表中尝试了这个:

<!--[if IE 9]>

nav li a:hover {
    text-decoration: underline;
    color: black;
}
nav .four a:hover{
    color:white;
}
<![endif]-->

上面的代码特定于我nav bar的IE 9(它的修复nav bar因为IE 9不支持文本阴影).

有没有办法在CSS样式表中执行此操作？

Answer 1

有条件的评论是只为HTML,但是你可以利用它在你的CSS.HTML5Boilerplate通过向html元素添加一个类来实现这一点(https://github.com/h5bp/html5-boilerplate/blob/master/index.html)

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->

这为您提供了一个只能用于定位IE的钩子:

.lt-ie8 .my-style { color: red }