CSS 混合模式不适用于文本和背景图像

问题描述

在我的新项目中，我想使用 mix-blend-mode: difference 作为我的徽标（顶部中心），但它不起作用。

See project

在 CSS 中，我使用了这个：

.sitetitle-txt-inner span {
    mix-blend-mode: difference;
}

问题出在哪里？

解决方法

您的父级 .sitetitle-txt-inner 是空的且透明的。

尝试为 <div> 和 <span> 添加不同的背景颜色，您会看到混合正在起作用。

---

红色和蓝色的结果：