Precedence of css "current" class over a:visited-CodePudding

The following test.html shows that the "current" class overrides "a:visited" for font-size, but not for color. Can you please offer an explanation and source of documentation for this behavior? I did search myself but could not find anything. Thanks!

<!DOCTYPE html>
<html>
  <head>
    <style>
      a:visited { font-size: 10px; color: purple; }
      .current { font-size: 50px; color: red; }
    </style>
  </head>
  <body>
    <a href="/test.html" class="current">test</a>
</body>
</html>

CodePudding user response：

... the "current" class overrides "a:visited" for font-size.

That's not what's happening. The font-size setting on a:visited is being ignored, because it can be exploited to detect a users browsing history, violating their privacy.

The CSS specs don't describe this exact details of which properties are honoured and which ignored. All they say is

Since it is possible for style sheet authors to abuse the :link and :visited pseudo-classes to determine which sites a user has visited without the user’s consent, UAs may treat all links as unvisited links or implement other measures to preserve the user’s privacy while rendering visited and unvisited links differently.

CodePudding user response：

Additional details: https://developer.mozilla.org/en-US/docs/Web/CSS/:visited

Basically you can set only colour-related properties: color, background-color, border-color, border-bottom-color, border-left-color, border-right-color, border-top-color, column-rule-color, outline-color, text-decoration-color, and text-emphasis-color.