我想在我的网站上有 2 个独立的背景,每边一个,根据屏幕大小进行调整
喜欢ownedcore.com两侧用中间 wrapper 调整
HTML:
<div id="bleft"></div>
<div id="wrapper">a</div>
<div id="bright"></div>
CSS:
@charset "utf-8";
header, section, footer, aside, bside, article, figure {display: block;}
* {margin: 0; padding: 0;}
#wrapper {
width: 1400px;
margin: 0 auto;
text-align: left;
position: absolute;
}
#bleft {
width: 700px;
height: 700px;
float: left;
background-image: url(images/pageBGLeft.jpg);
clear: left;
}
#bright {
width: 700px;
height: 700px;
float: right;
background-image: url(images/pageBGRight.jpg);
clear: right;
}
不强制正确的背景,但显示单行包装
最佳答案
该站点看起来像这样在 2 个容器上使用 2 个背景:
<body>
<div id="A">
<div id="B">
<div id="wrapper"></div>
</div>
</div>
</body>
然后CSS:
#A {
background: url(...) top right no-repeat;
}
#B {
background: url(...) top left no-repeat;
}
#wrapper {
width: 700px;
margin: 0 auto;
}
关于HTML/CSS,在每一侧获得 2 个背景以使用包装器进行调整,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13748450/