0

我试图在我的网站上有 2 个单独的背景,每侧一个,根据屏幕大小进行调整

就像在ownedcore.com上一样,其中边用中间包装进行调整

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;
}

不强制正确的背景,但显示一个换行符

4

2 回答 2

2

该站点看起来可以在 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;
}
于 2012-12-06T16:56:52.633 回答
0

我会尝试使用<img>元素。也许你可以试着position:fixed让一个是left: 0和另一个left: 50%。每个 to50%和 height auto 的宽度......可能需要玩一点,但我认为这个概念应该有效

于 2012-12-06T16:51:12.767 回答