文本修饰不适用于访问状态链接 [英] text-decoration not working for visited state link
问题描述
我是 CSS 中的新成员,并试图了解链接是如何由于状态更改而被修改的。在我的方案中,我想在链接打开时将 注意:Mozilla有一个关于相同问题的错误报告:一个href =https://bugzilla.mozilla.org/show_bug.cgi?id=645786 =nofollow> Mozilla Bug#645786 和bug报告。问题也会复制到 限制访问的链接样式 您仍然可以在视觉上对访问过的链接进行样式设定,但现在有 I'm new on CSS and trying to understand how links are modified due to the changed state. On my scenario, I want to change the Please notify that the color is updated (to green) when the link state changed to visited while the Note: There is a bug report for the Mozilla about the same issue: Mozilla Bug #645786 and on the bug report. Problem also reproduce for the
There is a limitation for styling the visited links; 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:
Privacy and the :visited selector 这篇关于文本修饰不适用于访问状态链接的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!文本修饰
更改为直通
>访问状态。但是,在 Mozilla 和 Chrome 浏览器中,文本修饰
未被<$ c $更新当链接处于访问状态时,如下图所示:
tag.class:state
选择器(a.:visited)(请参阅 Demo#2 )
演示#1
限制您可以使用的样式。
color
background-color $ b $只有以下属性
可以应用到访问过的链接b border-color(及其子属性)
outline-color
填充和描边属性的颜色部分
文字装饰
样式是不允许的,因为用户的隐私问题。 text-decoration
to the line-through
when the link is on visited state. However, neither on Mozilla nor Chrome browser, text-decoration
of the text content not updated with line-through
when the link is on visited state, shown as below. Where did I go wrong? text-decoration
stays the same (see. Demo #1);tag.class:state
selector (a.:visited) (see Demo #2)Demo #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>
color
background-color
border-color (and its sub-properties)
outline-color
The color parts of the fill and stroke properties
text-decoration
styling is not permitted due to the user's privacy issues.