Question

我的设计需要两个背景图像，必须在IE中工作。所以我决定在html标签上放置1个图像，在body标签上放置另一个图像。所以我的页面看起来像这样

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Untitled Document</title>
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
</head>
<body>
    <p>Lorem...</p>
</body>
</html>

那么一个非常基本的CSS就像这样

html { background:url(../img/bg.jpg) top center no-repeat #0094d4; margin:0; padding:0; }
body { background:url(../img/bgRep.png) repeat-x; margin:0; padding:0; }

唯一正确呈现此功能的浏览器是IE7。 Opera，Chrome，FF都在顶部放置了约20px的边距。我可以通过添加一些像这样的hackity css来删除这个边距：

html { background:url(../img/bg.jpg) top center no-repeat #0094d4; position:relative; }
body { background:url(../img/bgRep.png) repeat-x; margin:0; padding:0; top:0; position:absolute; width:100%; }

然而，为什么它开始不起作用，为什么我需要额外的东西？它是设计中的错误还是错误？

编辑：这似乎是一个错误。当我删除<p>标签时，它会正常运行，但不会。

Answer 1

而不是使用<p>的边距，而是使用填充。

正如上面提到的那样，它是由利润率下降引起的。

删除正文标记上的上边距

1 个答案: