html - CSS 多个背景图像都 repeat-x

Question

我现在尝试在一个 div 中获取多个背景图像。 两者 必须重复-x。

第一张图片应该从 左上角开始，最多占 div 的 50%。

第二个应该从 div 的中间到右端开始。

我尝试了以下方法:

.myDiv {
    background-image: url('image1.png'), url('image2.png');
    background-repeat: repeat-x, repeat-x;
    background-position: left top, center top;
    background-size: 50% 100%, 50% 100%;
}

我的问题是只显示了 image1。

Answer 1

像这样为任意元素设置两张背景图片

background: 
   url(number.png) 600px 10px no-repeat,  /* On top,    like z-index: 4; */
   url(thingy.png) 10px 10px no-repeat,   /*            like z-index: 3; */
   url(Paper-4.png);