Question

您好
我有一个根据浏览器应用不同样式的CSS，我想在CSS文件本身（不是HTML或PHP文件）中测试浏览器（如果浏览器不是IE）。

我该怎么办？我应该用这个：

<!--[if !IE]>
<style>
//code
</style>
<![end if]-->

CSS文件中的

???

Answer 1

最好将每个浏览器特定代码添加到单独的文件中，并使用与使用相同的条件导入所需的文件，是的，条件将在CSS之外和实际HTML文件中。

Answer 2

这些条件评论仅限IE。因此，检查!IE将无法对其他浏览器执行任何操作;）

你可以用Javascript注入CSS。我只是即兴创作，这样的事情可能会做（jQuery）：

if( !$.browser.msie ) {
  $("#someLinkElement").attr( "href", "webkit.css" );
}

编辑：此条件适用于非IE浏览器

Answer 3

不幸的是，没有与CSS中可以使用的条件注释等效的语法。条件注释是Microsoft的HTML扩展，而不是CSS。

然而，您可以用PHP编写CSS文件，并让PHP将其作为CSS文件提供。

请注意，用于检测不是Internet Explorer的浏览器的条件注释语法是错误的。您需要以下内容：

<!--[if !IE]>-->
<style>
//code
</style>
<!--<![endif]-->

这将隐藏IE的评论之间的代码。

Answer 4

更好的方法是根据浏览器类型/版本将特定类应用于页面的<html>元素。然后，您可以从CSS文件中定位特定的浏览器。

这正是html5 boilerplate project的作用：

<!doctype html>
<!--[if lt IE 7]> 
<html class="no-js ie6 oldie" lang="en">
<![endif]-->
<!--[if IE 7]>
<html class="no-js ie7 oldie" lang="en"> 
<![endif]-->
<!--[if IE 8]>
<html class="no-js ie8 oldie" lang="en">
<![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->

现在要专门为IE6编写CSS，您只需将以下内容添加到样式表中即可：

.ie6 .some-div {
    margin: 0;
}

依此类推。

我可以在CSS文件中插入浏览器测试或条件注释吗？

4 个答案: