一只名叫tom的猫
我看到2个简单的选择:在图像上具有半透明单个渐变的多个背景巨大的插图阴影渐变选项:html { min-height:100%; background:linear-gradient(0deg, rgba(255, 0, 150, 0.3), rgba(255, 0, 150, 0.3)), url(http://lorempixel.com/800/600/nature/2); background-size:cover;}阴影选项:html { min-height:100%; background:url(http://lorempixel.com/800/600/nature/2); background-size:cover; box-shadow:inset 0 0 0 2000px rgba(255, 0, 150, 0.3);}我的一个旧的Codepen,上面没有几个例子第三种选择使用background-blen-mode:该background-blend-modeCSS属性如何设定一个元素的背景图片应相互以及与元素的背景颜色相混合。html { min-height:100%; background:url(http://lorempixel.com/800/600/nature/2) rgba(255, 0, 150, 0.3); background-size:cover; background-blend-mode: multiply;}