html - 文本装饰不适用于访问状态链接

标签 html css google-chrome firefox text-decorations

我是 CSS 的新手,正在尝试了解链接如何因状态更改而被修改。在我的场景中,当链接处于visited 状态时,我想将text-decoration 更改为line-through。但是,无论是 Mozilla 还是 Chrome 浏览器,文本内容的 text-decoration 都没有用 line-through 更新当链接处于已访问状态时,如下图。我哪里做错了?

请注意,当链接状态更改为已访问text-decoration保持不变时,颜色会更新(变为绿色)(参见演示#1) ;

注意:Mozilla 有一个关于同一问题的错误报告:Mozilla Bug #645786和错误报告。 tag.class:state selector (a.:visited) 的问题也重现(参见Demo #2)

演示#1

<!DOCTYPE html>
<html>
    <head>
        <style>
            a:link {
                color: red;
                text-decoration: none;
            }

            a:visited {
                color: green;
                text-decoration: line-through;
            }

            a:hover {
                color: blue;
            }

            a:active {
                color: yellow;
            }
        </style>
    </head>
    <body>
        <p>
            <b>
                <a href="http://google.com" target="_blank">This is a link</a>
            </b>
        </p>
    </body>
</html>

Demo #2 --Selector With Class

<!DOCTYPE html>
<html>
    <head>
        <style>
            a.linkClass:link {
                color: red;
                text-decoration: none;
            }

            a.linkClass:visited {
                color: green;
                text-decoration: line-through;
            }

            a.linkClass:hover {
				color: blue;
            }

            a.linkClass:active {
				color: yellow;
            }
        </style>
	</head>
    <body>
        <p>
            <b>
                <a class="linkClass" href="http://google.com" target="_blank">This is a link</a>
            </b>
        </p>
    </body>
</html>

最佳答案

对已访问链接的样式设置有限制;

Limits to visited link styles

You will still be able to visually style visited links, but there are now limits on what styles you can use. Only the following properties can be applied to visited links:

color
background-color
border-color (and its sub-properties)
outline-color
The color parts of the fill and stroke properties

Privacy and the :visited selector

text-decoration 由于用户隐私问题,不允许使用样式。

关于html - 文本装饰不适用于访问状态链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35031032/

相关文章:

php - 有没有办法在php中的不同时间加载页面的不同部分

javascript - 将 HTML 代码保存在 MySQL 中

html - 如何保持侧边栏不可移动并在其父级内部?

html - 样式表未链接到 html

javascript - 一页上的多个选项卡式区域(纯 Javascript)

jquery - 如果在 keyup 上添加了字符,则不会触发输入中的 Google Chrome 更改事件

html - CSS:如何将元素放在最后一行文本旁边

html - 响应式背景图像分辨率

java - Chrome 用于测试无法在 Docker 容器中启动

html - 如何删除自动 float 占位符错误?