背景图片未扩展到页面底部
[英]Background image not extending to bottom of page
问题描述
我正在我的网站上处理一个包含大量数据的页面，因此该页面确实很长。 该页面由主体的背景图像和带有背景图像的容器组成，两者均在页面的整个长度上运行（不是上边距或下边距，也没有上边距或下边距）。 我遇到了背景图片的问题：它们在某些分辨率下没有扩展到页面底部。 我编写的屏幕为1680像素宽，目前两个背景图像一直延伸到底部。 但是，当我在分辨率较低的屏幕（例如1280像素宽的屏幕）上查看页面时，背景图像不会一直延伸到底部。
我正在使用XHTML 1.0 Strict。
以下是相关的HTML代码：
<body class="ice01">
<div id="maincontent2">
<!-- content -->
</div>
</body>
以下是相关的CSS代码：
.ice01 {
background-image: url('../images/iceBackground04.jpg') ;
margin: 0 100px;
font-family: book antiqua;
font-size: 19px;
color: #12124c;}
#maincontent {
width: 88%;
background-image: url(../Images/BlueParchment.jpg);
margin: 0px auto;
padding: 0px 32px 0px 32px;}
如果我调整窗口大小，也会出现此问题。 另外，如果我取出背景图像并用颜色替换它们，这个问题就消失了。 我尝试使用后退速记（ background: #0000ff url('../images/iceBackground04.jpg') repeat 0 0; ），但这不能解决问题。
我尝试使用min-height: 100%; 对他们两个，它不能解决问题。 我还通过W3C验证了该网页，并且所有网页都已签出，因此我认为它不是由任何丢失/未关闭的标签引起的。
这是相关页面的网址： http : //icengale.com/icenDeities-Mainen.html
我正在使用“重置”的css文件，但是删除该文件不能解决问题，因此我不认为这是导致问题的原因。
非常感谢您的任何帮助！
1 个解决方案
解决方案1
0 2013-07-03 04:56:27
如果可行，请尝试以下CSS。
.ice01 {
background:url(../images/iceBackground04.jpg) repeat-x 0 0;
margin: 0 100px;
font-family: book antiqua;
font-size: 19px;
color: #12124c;}
#maincontent {
width: 88%;
background:url(../images/BlueParchment.jpg) repeat-x 0 0;
margin: 0px auto;
padding: 0px 32px 0px 32px;}
背景图像没有延伸到窗口的底部
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.