我在将div背后的背景居中时遇到了麻烦。我做了一个小提示,显示背景图像在浏览器窗口调整大小时如何保持居中,这很好,但是如果向下移动滚动条以查看绿色div的底部,则背景跟随滚动,所以不是长期居中,我试图避免。我希望bk-gnd图像的中心文本始终保持在视口中心,无论是调整屏幕大小还是滚动,这可能吗?
这是互动小提琴:http://jsfiddle.net/4fM2n/
CSS
html, body {
height: 100%;
margin: auto;
}
#bk-gnd-div {
height: 100%;
background-image: url('http://oi58.tinypic.com/5an82h.jpg');
margin: auto;
background-repeat: no-repeat;
background-position: center center;
background-color: #9FBBE2;
}
其他div代码在小提琴上,stackoverflow说它没有正确格式化并且不让我发布它?也许这是一个线索?
答案 0 :(得分:0)
添加css
*{
margin: 0;
padding: 0;
}
#bk-gnd-div {
margin: 0 auto;
width: 100%;
}
或图像固定中心
body {
width: 100%;
height: 100%;
background-image:url('http://oi58.tinypic.com/5an82h.jpg');
margin:0 auto;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}