是否可以使用 CSS 并排设置背景颜色和背景照片？

Question

使用单个外包装容器，是否可以在背景照片旁边设置背景颜色，如附图所示？它需要是一个包装器，因为我想在里面添加一个子 div 来覆盖整个区域。照片需要随着浏览器容器的增大/缩小而增大/缩小。

<div class="outerWrapper">
     <div class="innerWrapper"></div>
</div>

Answer 1

是的

.d1 {
  width: 100%;
  height: 150px;
  background-color: green;
  background-image: url(http://picsum.photos/500);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: right center;
}

<div class="d1"></div>