-3

当使用带有 !important 的 IE 条件（例如下面的代码）时，无论浏览器如何，背景都默认为带有 !important的背景色，即使在 IE 条件中也是如此。

如何重写此代码，以便浏览器接受小于 IE9 的背景颜色和 IE9 和其他浏览器中的图像（高度/宽度：100%，无重复）？

注意：我计划在默认情况下主题自动设置颜色或图像的 Wordpress 站点中使用它，因此我必须使用 !important 来覆盖默认主题样式。

body {
<!--[if lt IE 9]>
background-color:#c1beb2 !important;
background:#c1beb2 !important;
<![endif]-->
<!--[if gte IE 9]>
background-image: url("http://example.com/wp-content/example.png") !important;
background-position:left bottom;
background-size: 100% 100%;
background-repeat: no-repeat;
<![endif]-->
<![if !IE]>
background-image: url("http://example.com/wp-content/example.png") !important;
background-position:left bottom;
background-size: 100% 100%;
background-repeat: no-repeat;
<![endif]>
}
4

2 回答 2

6

条件注释用于 HTML，而不是 CSS。

也就是说，在您的 HTML 中链接到 IE 特定样式表，如下所示：

<!--[if lte IE 9]> 
<link rel="stylesheet" href="/ie.css" type="text/css" media="no title" charset="utf-8" />
<![endif]-->

这是正确的方法。如果您不想创建一个完整的其他 IE 特定样式表，您可以依赖CSS IE Hacks。

于 2012-09-28T15:14:32.487 回答
0

好的，等一下。据我所知，这些（！）浏览器开关在 css 中不起作用。因此，您需要像这样在 html 中进行切换部分：

<!--[if lt IE 9]>
  <link rel="stylesheet" type="text/css" href="IE9.css">
<![endif]-->
<!--[if gte IE 9]>
  <link rel="stylesheet" type="text/css" href="IEgte9.css">
<![endif]-->

然而，这是一种糟糕的风格。通常，您不希望浏览器具有单独的样式。在极少数情况下，您也需要。检查 html5 样板以获取有关此的一些信息。

于 2012-09-28T15:18:14.527 回答