css - Mix-blend-mode:乘法在 Chrome 中不起作用

标签 css google-chrome mix-blend-mode

我正在尝试在 Chrome 上使用 mix-blend-mode: multiply 但它没有按预期工作:当我添加 magenta 时,cyanyellow 一起它不会给我黑色但 brown .在 Safari 中,一切正常。

enter image description here

我尝试了添加以下代码的技巧:

html, body {
    background-color: white;
}

但这并没有改变任何东西。还有其他解决办法吗?

谢谢!

最佳答案

Chrome 有一个关于 mix-blend-mode 和 body 的已知问题,问题是它没有将 body 作为背景生效,所以你应该尝试使用中间 div 具有此效果的白色背景。

关于css - Mix-blend-mode:乘法在 Chrome 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70579988/

相关文章:

css - 是否可以将此动画复制到任何主题?

css - mix-blend-mode 不适用于 Chrome

css - 实现 Slick Slider 时使用 mix-blend-mode 的元素会中断

html - 使用 mix-blend-mode 在顶部居中文本的圆上动画刻度

html - 流体分区宽度

javascript - 在 bootstrap 4 中隐藏范围输入按钮?

ajax - chrome中跨域ajax POST

google-chrome - Chrome 开发者栏 : Reorder Elements

javascript - 如何允许我的 Chrome 应用访问外部 Api

html - 如何用CSS选择dl元素的奇数子元素?