Question

我喜欢在我的样式表中使用像这样的条件css

 div.box {  
     width: 400px;  
     [if IE 6] width: 600px;  
     padding: 0 100px;  
 }

我想在ie6中为我的div设置一个不同的宽度，所以我正在尝试这个代码而不工作，我怎样才能在ie6中设置不同的宽度

我也在我的样式表中试过这个

[if IE]
div.box {
         width: 600px;  
         padding: 0 100px; 
}
[endif]

Answer 1

为ie6做条件的最好方法是在html页面的头部添加一个条件包含，如下所示：

<!--[if IE 6]>
  <link rel="stylesheet" href="[something like style/ie6.css goes here]" type="text/css">
<![endif]-->

然后只需将新宽度作为ie6.css样式表中元素的例外添加。

Answer 2

条件注释用于 HTML 文档内部，而不是CSS文件内部。 IE的HTML解析器将解释注释中的规则 - 据我所知，它的CSS解析器中没有等效的逻辑。

以下代码可以使用：

<!--[if IE 6]>
<style type="text/css">
div.box {
         width: 600px;  
         padding: 0 100px; 
}
</style>
<![endif]-->

在大多数情况下，最好使用条件注释来包含外部样式表，而不是仅仅包装内联样式块，如下所示：

<!--[if IE 6]>
<link rel="stylesheet" href="/css/IEpatches.css" type="text/css" media="screen" charset="utf-8"/>
<![endif]-->

编辑仅根据问题中的要求指定IE6。

Answer 3

你试过吗？

<!--[if IE]>
// Your conditional CSS
<![endif]-->

我认为您的条件声明格式错误。

Conditional Comments

Answer 4

您是否阅读过Conditional-CSS文档？具体来说，你是通过Conditional-CSS编译器运行你的CSS吗？因为如果你不这样做，你只会将CSS发送到浏览器不变 - 那么Conditional-CSS就没有办法发挥它的魔力。

Answer 5

正如您现在可能已经了解到的那样，条件注释在HTML输出中解析，而不是在CSS文件本身中解析，除非您使用third party software。

另一种可以在没有hacks的CSS文件中定位IE的方法：

<!--[if lt IE 7]> <html class="ie6"> <![endif]-->
<!--[if IE 7]>    <html class="ie7"> <![endif]-->
<!--[if IE 8]>    <html class="ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->

在IE中使用这种技术的变体已经变得很普遍，我相信它在HTML5 Boilerplate受欢迎。您基本上使用条件注释将类添加到<html>标记（或者您希望的正文标记），这样您就可以像这样定位CSS文件中的元素：

.ie6 #header {
    /* some ie6 only styles here */
}

对我来说，这比使用单独的样式表更容易维护，但是其他浏览器读取（但不适用）IE样式时会受到轻微的挫折。

条件css不起作用

5 个答案: