时间戳

首页 > 解决方案 > CSS：混合混合模式使转换不再起作用（Chrome，Firefox）

css - CSS：混合混合模式使转换不再起作用（Chrome，Firefox）

问题描述

似乎mix-blend-mode: multiply使任何transform不再起作用。这发生在 Chrome 和 Firefox 中，而在 Safari 上它可以工作。（全部更新到最新版本）

在这个小提琴中你可以看到行为：小提琴 （对不起，如果有点乱，我不是开发人员）

第一个图像没有multiply类，而第二个图像有它。

.inner {
  -webkit-transform: translateZ(30px);
  transform: translateZ(30px);
}

.innerUp {
  -webkit-transform: translateZ(100px);
  transform: translateZ(100px);
}

.multiply {
  mix-blend-mode: multiply;
}

我已经找到了一些关于此的讨论，但没有一个能够解决这个问题。

谢谢！

标签： cssgoogle-chromefirefoxtransformmix-blend-mode

解决方案

推荐阅读