Current color

---

title: 当前颜色 CSS 关键字 type: 提示 language: css tags: [视觉] cover: picking-berries excerpt: currentColor CSS 关键字是一个巧妙的替代方案，适用于简单的用例。 dateModified: 2022-11-30

---

现代 CSS 支持自定义属性，然而 currentColor 关键字比它们早几年出现。因此，你可能仍然会在代码中找到它，了解它的作用和工作原理是值得的。

<p>我的<span>背景</span>与我的<a href="#">文本</a>颜色相同。</p>

p {
  color: #101010;
}

p, p > * {
  background-color: currentColor;
}

a {
  color: #0077ff;
}

span {
  color: #fd203a;
}

currentColor 包含元素的 color 属性的当前值。当你想要为多个属性使用相同的颜色时，比如 border-color 或 background-color，它非常有用。它还遵循层叠规则，所以如果没有为 color 提供值，它将使用父元素的 color 属性的值。