2个背景拉伸1个背景

Question

有没有办法拉伸1个背景。如果你设置了2？

body{

background-image: url(../images/pattern.png), url(../images/2.jpg);
background-repeat: repeat, repeat;
}

不是拉伸第一张图片，而是第二张图片(2.jpg)

​

​

图像需要100%拉伸

Answer 1

您可以执行以下操作

body {
    background-image: url(bg1.png), url(bg2.png);
    background-repeat: repeat-y, repeat;
}

bg1.png (包含单个“1”)将向下重复

bg2.png (包含一个'2')将在上下重复

​

​

Answer 2

使用下面的css，您可以向下重复第一个图像，并且只将第二个图像拉伸到100%

body {
    background-image: url(bg1.png), url(bg2.png);
    background-repeat: repeat-y, no-repeat;
    background-size: 29 29, 100% 100%;
}

​

​

结合DOCTYPE似乎有一些问题。下面这段CSS与DOCTYPE结合起来工作得很好。

body{
    background-image: url('../images/pattern.png'), url('../images/2.jpg');
    background-repeat: repeat, no-repeat;
    background-size: 29px 29px, 100% 100%;
}

​

​