Link 样式不会相互覆盖

Question

如果我将此 CSS 添加到页面底部：

<style>
    a:link {
        font-weight: bold;
    }

    a:visited {
        font-weight: normal;
    }
</style>

我希望它（仅）将未访问的链接设为粗体。但事实并非如此。

我是不是误会了purpose/use这些伪类？

这是一个完整的页面示例：

<!DOCTYPE html >
<html>
<head>
    <style>
        body {
            font-size: 16pt;
        }
        a:link {
            font-weight: bold;
        }

        a:visited {
            font-weight: normal;
        }
    </style>
</head>
<body>

    <a href="https://www.rgraph.net">This link should not be bold</a>

</body>
</html>

Answer 1

将文本设为粗体会更改其大小。这会移动页面周围的所有内容。

如果您可以在 link 访问它们时停止使用粗体字，您可以使用 JavaScript 测量它们的大小或附近事物的位置，并确定用户是否访问过 link与否。

这是对隐私的侵犯（并且具有安全隐患，因为它可用于定制网络钓鱼攻击），因此被禁止。

参见Privacy and the :visited selector。

Link 样式不会相互覆盖

Link styles not overriding each other

css