Question

我有CSS3的双重背景，我想要第二个背景，从屏幕中间到底部（不是从顶部）重复。

http://es.tinypic.com/r/2s6x5w8/8

这是我的css

body {
  background: url('../img/carbon_fibre.png'), url('../img/carbon_fibre_blue.png');
  background-repeat: repeat, repeat;
  background-position: center left, left top;
}

有些机构知道如何解决这个问题？

Thnaks，Christian

Answer 1

你不能用2个背景来做，@ Aliassse是绝对正确的。

获得该效果的唯一方法是使用伪元素。

CSS

body {
  background: url(http://placekitten.com/50/50);
  background-repeat: repeat;
  background-position: left top;
    position: relative;
    height: 100%;
}

body:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0px;
    right: 0px;
    bottom: 0px;
  background: url(http://placekitten.com/40/40);
  background-repeat: repeat;
  background-position: left top;
}

fiddle

双背景，一个背景重复从中间 - css3

1 个答案: