CSS背景颜色未一致地应用于访问过的链接。由GM_addStyle添加的CSS

Question

我注意到GM_addStyle()添加了CSS的一些奇怪行为。我有以下用户名：

// ==UserScript==
// @name        Reddit
// @namespace   http://example.com
// @include     http://www.reddit.com/
// @grant       GM_addStyle
// @version     1
// ==/UserScript==

GM_addStyle("a:visited { background-color: yellow !important; }");

现在，我希望这种行为可以适用于所有链接，也可以不使用任何链接（由于安全补丁），但我得到的是一种不一致的行为，因为它适用于某些链接，但不适用于其他链接。

有人可以为我解释上述行为吗？

Answer 1

来自Privacy and the :visited selector at MDN：

  

只有以下属性可以应用于访问过的链接：

     

  
• 颜色
  
• 背景颜色
  
• border-color（及其子属性）
  
• 轮廓色
  
• 填充和描边属性的颜色部分
  

     

此外，即使您可以为访问过的链接设置属性，也无法更改未访问链接和访问过的链接之间的透明度，因为您可以使用rgba（ ）或hsla（）颜色值或透明关键字。

显然，这意味着，在Firefox中，为了让您更改背景颜色，链接必须首先具有背景（您无法使用:visited添加背景选择）。因此，在尝试设置访问链接的背景颜色样式之前设置背景。

这对我有用：

// ==UserScript==
// @name        _Reddit, style visited links
// @include     http://www.reddit.com/*
// @grant       GM_addStyle
// @version     1
// ==/UserScript==

GM_addStyle (
      /* For precision, only prime the desired links, that don't
        otherwise have a BG.
      */
      "a.title { background: white; }"
    + "a:visited { background-color: yellow !important; }"
);

请注意，我只是“准备”了我明确感兴趣的链接，这些链接还没有背景。因此，a.title {...代替a {...。

---

另请注意，仅更改样式，Stylish通常是更好的选择（性能和易于设置）。