使用 CSS 将文本颜色设置为红色背景上的白色和白色背景上的黑色文本颜色

Question

我需要一个 CSS 样式，当背景为红色时使文本颜色为白色，当背景为白色时使文本颜色为黑色。

我的红色背景颜色如下：#d6002e

我将这个 CSS 添加到我的文本中：

mix-blend-mode: difference;
color: #29FBFF;  // Inverted color of my red

现在看起来像这样：

我的文字得到了背景的反色，这不是我想要的。

Answer 1

我觉得这应该可以解决问题

.my-red-bg {
    background: #d6002e;
    color: white
  }


.my-black-bg {
    background: black;
    color: white
 }