Question

我定义了一些div，它们具有部分透明的背景，彼此重叠，我想将其中一个连接到div的底部。但是，如果我向div添加内容，则会在我指定min-height的位置附加背景。这种情况发生在IE以外的所有浏览器中。这是我的代码：

#content1 {
    background-image: url(image/main_background.png);
    margin-left: 12px;
    margin-right: 12px;
    /*margin-top: 0px;
    margin-bottom: 0px;*/
    border-style: solid;
    border-left-width: 3px;
    border-right-width: 3px;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-color: #000000;
    width: 976px;
    min-height: 355px;
    float: left;    
    }
#content2 {
    background-image: url(image/top_gradient.png);
    background-repeat: repeat-x;
    width: 976px;
    min-height: 355px;
    }
#content3 {
    background-image: url(image/bottom_gradient.png);
    background-repeat: repeat-x;
    background-position: 0% 100%;
    width: 976px;
    min-height: 355px;
    }
#content4 {
    background-image: url(image/top_background.png);
    background-repeat: no-repeat;
    width: 976px;
    min-height: 355px;
    clear: both;
    }

和

<div class="container">
    <div id="content1"><div id="content2"><div id="content3"><div id="content4">
        <div id="content_elements">
            <::content::>
        </div>
        <div id="sidebar_elements">
            <::sidebar::>
        </div>
    </div></div></div></div>
</div>

谢谢！

Answer 1

这是否有效：background: url('background.png') no-repeat bottom;所以在不重复之后添加底部。

将背景图像附加到尺寸改变div的底部

1 个答案: