【问题标题】:Blending div's background混合 div 的背景
【发布时间】:2014-08-14 18:03:08
【问题描述】:

我想要这样的背景混合效果,就像附上的截图一样。 我已经使用了 rgba 背景,但这看起来不像我的设计。

这是我使用的图像和代码。

我尝试使用不同的背景图片和 css3 元素,但它无法正常工作。

这可能使用任何 jquery 吗?

.green_band {background: rgba(24, 95, 14, 0.5);}

【问题讨论】:

    标签: html css background photoshop color-blending


    【解决方案1】:

    不,目前(2014 年夏季)您只能使用 Alpha 透明度(例如使用 rgba)来伪造它。

    CSS 混合模式将会出现,但“这是一项即将到来的技术,而且在撰写本文时,浏览器支持不完整”。

    请参阅“Getting to know CSS Blend Modes” 了解简介和the browser support tables for background-blend-mode

    使用即将推出的 CSS 混合模式属性:

    background-color: rgb(24, 95, 14);
    background-blend-mode: multiply;
    

    这里是W3C Editor’s Draft: Compositing and Blending Level 1

    【讨论】:

    • @vico 嗯,这是 2015 年的技术……
    • 由于人们不喜欢更新东西,这在另外 2 -3 年内不会发挥作用
    【解决方案2】:

    我不确定有没有办法在 Photoshop 之外使用混合模式,除非您想编写 WebGL 着色器。

    【讨论】:

      猜你喜欢
      • 2013-04-28
      • 2011-10-03
      • 2011-07-23
      • 2021-06-06
      • 1970-01-01
      • 1970-01-01
      • 2015-07-03
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多