Question

我会创建一个白色的网站,因此,我有自己的背景。但我想在网站的两个部分补充一些蓝梯度细节。 #bg_top将上下至左上,pbg_bottom应当上下至右上。当然,这并不是我想要的方式。

This is how its displayed on my html:

<body>

<div id="bg_top"></div>

<div id="wrapper">
</div>

<div id="bg_bottom">
</div>

<footer>
</footer>

#bg_topwork是完美的。它确实展示了包装后,但肉体正给我问题,把它当作它所处位置,而是视像在包装人和鞋子之间。因此,我使用了z-index,但也没有工作。奇怪的是,底部和左侧的胎盘造成任何变化。《社会保障法》是:

#wrapper{
    width: 925px;
    height: 1355px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

#bg_top{
    width: 500px;
    height: 500px;
    position: absolute;
    top: 0px;
    left: 0px;
    background-image: url( ../_img/2_body/bg/bg_top.jpg );
    z-index: -1;
}

#bg_bottom{

    width: 500px;
    height: 500px;
    position: relative;
    float: right;
    bottom: 0px;
    right: 0px;
    background-image: url( ../_img/2_body/bg/bg_under.jpg );
    z-index: -1;
}

有些人能否帮助我? 我尝试了一切......

感谢

Answer 1

我已经回答了。我的画面必须落后。底层的景象与头部一样,与头部一样,与头部和上层的顶部相挂钩。由于我的意见,我认为这非常简单。

 <body>

<header>

<div id="bg_top"></div>

</header>


<div id="wrapper"></div>


<footer>
<div id="bg_bottom"></div>
</footer>

</body>

因此,在我采取绝对立场和z子指数和情景之后,又做了......幕后和幕后。这是捷克统计局的最后法典:

#bg_top{
    width: 500px;
    height: 500px;
    position: absolute;
    top: 0px;
    left: 0px;
    background-image: url( ../_img/2_body/bg/bg_top.jpg );
    z-index: -1;
}



#bg_bottom{

    width: 500px;
    height: 500px;
    position: absolute;
    background-image: url( ../_img/2_body/bg/bg_under.jpg );
    bottom: 155px;

Any other doubts maybe I can help... right: 0px; z-index: -1; }

Answer 2

问题在于,你没有把 wrap子和 b子装在 wrap子里。当你这样做时,它就完美地运作。请找到我使用的假肢

http://jsfiddle.net/meetravi/sL5jm/

Good Luck !

Answer 3

With position: relative, if you want it visually inside the wrapper, you need to put the HTML inside the wrapper.

友情链接