IE 条件注释不起作用

Question

我正在使用IE（Internet Explorer）条件注释来修复IE上的边距问题，但由于某种原因它不起作用，我无法修复它。

CSS 代码（嵌入在条件注释中）：

<!--[if IE]>
   <style>
.right_header_form{
    float: right;
    margin: -360px 50px 0;
    width: 240px;
    height: auto;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    line-height: 21px;
    padding: 0px;
    background-color: #444;
    color: #FFF;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 10px 15px;
}
.right_form {
    float: right;
    margin: -320px 50px 0;
    width: 240px;
    height: auto;
    background-color: #F5F5F5;
    color: #666;
    margin-bottom: 20px;
    padding: 15px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
  </style>
<![endif]-->

我所有其他浏览器的原始CSS代码：

.right_header_form{
    float: right;
    margin: -390px 50px 0;
    width: 240px;
    height: auto;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    line-height: 21px;
    padding: 0px;
    background-color: #444;
    color: #FFF;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 10px 15px;
}
.right_form {
    float: right;
    margin: -350px 50px 0;
    width: 240px;
    height: auto;
    background-color: #F5F5F5;
    color: #666;
    margin-bottom: 20px;
    padding: 15px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

如您所见，每个代码之间的边距不同。正如我所说，它不起作用，但似乎代码是有效的。

问：如何仅使用条件注释更改 IE 的 CSS 代码？

Answer 1

    <!--[if IE]>
        <style>
            .right_header_form{
                margin: 20px 0 0;
            }
            .right_form {
                margin: 20px 0 0;
            }
        </style>
    <![endif]-->
    <link rel="stylesheet" href="css/style.css" type="text/css" />

从mediafire.
检查了您的PHP代码，因为IE条件在代码中处于第一个位置。应该是第一风格.css。CSS 优先级。

应该是：

    <link rel="stylesheet" href="css/style.css" type="text/css" />
    <!--[if IE]>
        <style>
            .right_header_form{
                margin: 20px 0 0;
            }
            .right_form {
                margin: 20px 0 0;
            }
        </style>
    <![endif]-->

Answer 2

问题是

margin: -390px 50px 0;

基本上，你猜测.main_form的高度是390px，所以你让.right_header_form向上390px。

这很糟糕。

在编写页面代码之前，您必须考虑一个好的设计。

在这种情况下，制作两列并将它们一列放在另一列旁边，浮动第一列（第二列可选）。并将标题放在每列内。

Answer 3

请注意，条件注释仅适用于 INTERNET EXPLORER 9 及更低版本，从 IE10 及更高版本开始，它已被禁用。

我建议你把你的IE CSS放在另一个叫做iestyle的css文件中.css并像这样称呼它：

<!--[if IE]>
  <link rel=”stylesheet” type=”text/css” href=”iestyle.css”/>
<![endif]-->

这必须有效，

祝你好运。

PS：也

您可以在 HTML 中使用条件注释将不同的 CSS 类或 ID 应用于随后可以使用 CSS 定位的元素。

工作原理如下：

<!--[if IE]>
  <div id="content" class="ie">
<![endif]-->
<!--[if !IE]>
  <div id="content">
<![endif]-->

它的作用是IE它添加一个您在 CSS 中指定的类"ie"，当它不是 IE 时!IE它不会添加该类。