1

这是我的“简洁”HTML

<html>
<head>
    <style type="text/css">
        body.custom.one_sidebar {
            background:#f5f5f5 url('img/bg/bg-content.png') no-repeat 50% 36.1em;
            overflow-x:hidden;
        }
    </style>
</head>
<body class="custom one_sidebar">
    <div class="header_area"></div>
    <div class="content_area"></div>
</body>
</html>

问题是背景图像位置在 IE7 中不起作用。它适用于 IE8 和几乎所有其他浏览器。在找出原因方面需要一些帮助。

4

2 回答 2

1

那是因为你在这个位置上混淆了百分比和 em。对于 IE7，您必须使用 2 倍相同的百分比/像素或 em：

body.custom.one_sidebar {
 background:#f5f5f5 url('img/bg/bg-content.png') no-repeat 50% value%;
 overflow-x:hidden;
}

或者

body.custom.one_sidebar {
 background:#f5f5f5 url('img/bg/bg-content.png') no-repeat value_em 36.1em;
 overflow-x:hidden;
}
于 2012-08-28T21:41:35.163 回答
0

首先，确保您选择了一个 Doctype，因为没有一个，它将触发 Quirks 模式，并且 IE 将无法正确（或根本）呈现一些速记背景属性。

尝试display: block在侧边栏 CSS 中添加 , 和适当的宽度和高度。当元素没有被严格定义为块元素时，IE 已经知道渲染某些属性的问题。

于 2012-08-28T21:20:38.900 回答