Question

示例，html代码，

<div id="container_background">
    <div id="content">
        <p>
            #container
        </p>
    </div>
</div>

CSS

#container_background{
    background-image:url('main_bg.gif');
    height: 430px;
}

如果我这样编码，背景将应用于#container_background div，而不是#content div。

我如何申请#content？

当然，＃content内的background-image将不是一个选项，因为图像必须是一个连接的图像，但如果我把它放在一起，它就不会被连接。

Answer 1

您应该为div添加类而不是像这样的标识符：

.container-background .content {
     background:transparent;
}

Answer 2

试试这个CSS：

代表#container_background：

#container_background{
    background-image:url('main_bg.gif');
    height: 430px;
}

代表#content：

#content{
        background-color:transparent;
}

Answer 3

使用css的跨浏览器透明度：

#content {
    filter: alpha(opacity=0); /* internet explorer */
    -khtml-opacity: 0;      /* khtml, old safari */
    -moz-opacity: 0;       /* mozilla, netscape */
    opacity: 0;           /* fx, safari, opera */
    }

如何将背景图像应用于低div

3 个答案: