css - 为什么我必须覆盖 webkit 样式表才能为 anchor 链接创建 css 规则？

Question

为什么 :root color 不能是 :root color？这不是它的目的吗？

:root {
    color: #4c4e4d;
}

/* this seems excessive to have to 'inherit override' anchor  
links. */
a:-webkit-any-link {
  color: inherit;
}

Answer 1

链接是colored differently from the rest of the text by default .在过去的 20 年里，几乎每个浏览器都这样做过；它不是特定于 WebKit 的东西。因此，如果您希望链接与文本的其余部分颜色相同，则需要指示浏览器使它们如此。执行此操作的惯用方法是使用 color: currentColor 而不是 color: inherit，以及跨浏览器兼容的选择器(如果您不打算这样做WebKit 特定的)是 a[href]。

如果你问为什么作者级别的 :root 规则不覆盖 UA 级别的 a:-webkit-any-link 规则，原因是双重的:

1. 在 :root 中设置字体颜色并不意味着“强制页面上的所有文本都是这种颜色”，它意味着“在根元素上设置颜色，允许后代可以正常继承该颜色。”

2. 继承值永远不会覆盖级联值，无论它们来自何处，也无论两个选择器的特异性如何(当选择器开始匹配不同元素时，特异性不会进入对话)。