0

可能是我做错了一些基本错误,但 Chrome/FF 似乎没问题,但 IE8 中断(我没有尝试过其他版本)。

我为 body 标签设置了背景,并定义了背景位置。这就是 html 的外观。

<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<style>
body {
    background:#fff url(skyhouse.jpg);
    background-position: bottom left;
    background-repeat: repeat-x;
}
</style>
</head>
<body>
<div style="width: 100%;float: left;">
    <div style="background-color: yellow;height: 400px;width: 400px;">
    </div>
</div>
</body>
</html>

当我有一个紧跟在 body 标记之后的 div 标记和一个浮动(向左或向右)的标记时,我看到背景没有正确呈现。

Div 向左浮动,宽度 100%

Div 向左浮动,宽度 80%

当我删除浮动或将边距设置为自动时,背景渲染正常

浮动已移除

如果我删除背景定位,无论浮动如何,背景都会呈现良好

背景位置已移除

不确定似乎是什么问题。

4

1 回答 1

0

演示:http: //jsfiddle.net/aHkJ5/1/

它适用于这个 -

html, body{
    height: 100%;
    width: 100%;
}
body {
    background:#fff url(http://www.makems.com/graphic/rainbow-abstract.jpg);
    background-position: left bottom;
    background-repeat: repeat-x;
}​
于 2012-06-07T04:09:13.093 回答