I have to disable color change of anchor tag when visited. I did this:
当访问时,我必须禁用锚标记的颜色更改。我这样做:
a:visited{ color: gray }
(The link is gray in color before visited). But this is a way where I explicitly state the color after the link is visited, which is again a color change.
(该链接在访问前是灰色的)。但这是我在访问链接后显式地声明颜色的一种方式,这也是一种颜色改变。
How can i disable color change of anchor tag when visited without doing any explicit color changes?
在访问时如何禁用锚标记的颜色更改,而不做任何显式的颜色更改?
6 个解决方案
#1
60
You can't, you can only style the visited state.
不能,只能对已访问状态进行样式化。
For other people find this, make sure that you have them in the right order:
对于其他人来说,确保你有正确的顺序:
a {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
#2
144
If you just want the anchor color to stay the same as the anchor's parent element you can leverage inherit:
如果您只是希望锚点颜色与锚点的父元素保持一致,您可以利用继承:
a, a:visited, a:hover, a:active {
color: inherit;
}
Notice there is no need to repeat the rule for each selector; just use a comma separated list of selectors (order matters for anchor pseudo elements). Also, you can apply the pseudo selectors to a class if you want to selectively disable the special anchor colors:
注意,没有必要为每个选择器重复规则;只需使用逗号分隔的选择器列表(锚伪元素的顺序)。此外,如果您想选择性地禁用特殊锚定颜色,您可以将伪选择器应用到类中:
.special-link, .special-link:visited, .special-link:hover, .special-link:active {
color: inherit;
}
Your question only asks about the visited state, but I assumed you meant all of the states. You can remove the other selectors if you want to allow color changes on all but visited.
你的问题只问访问的州,但我认为你指的是所有的州。如果您希望允许除已访问之外的所有选项更改颜色,可以删除其他选择器。
#3
10
For :hover
to override :visited
, and to make sure :visited
is the same as the initial color, :hover
must come after :visited
.
For:hover to override:visited,并确保:visited与初始颜色相同,:hover must come after:visited。
So if you want to disable the color change, a:visited
must come before a:hover
. Like this:
因此,如果要禁用颜色更改,a:visited必须在a:hover之前。是这样的:
a { color: gray; }
a:visited { color: orange; }
a:hover { color: red; }
To disable :visited
change you would style it with non-pseudo class:
禁用:访问更改,您将使用非pseudo类进行样式化:
a, a:visited { color: gray; }
a:hover { color: red; }
#4
0
Either delete the selector or set it to the same color as your text appears normally.
要么删除选择器,要么将其设置为与文本正常显示的相同颜色。
#5
-2
You can solve this issue by calling a:link
and a:visited
selectors together. And follow it with a:hover
selector.
您可以通过一起调用a:link和a:已访问的选择器来解决这个问题。然后使用:hover选择器。
a:link, a:visited
{color: gray;}
a:hover
{color: skyblue;}
#6
-3
a:visited {
text-decoration: none;
}
but it will only affect links that haven't been clicked on yet.
但它只会影响尚未点击的链接。
#1
60
You can't, you can only style the visited state.
不能,只能对已访问状态进行样式化。
For other people find this, make sure that you have them in the right order:
对于其他人来说,确保你有正确的顺序:
a {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
#2
144
If you just want the anchor color to stay the same as the anchor's parent element you can leverage inherit:
如果您只是希望锚点颜色与锚点的父元素保持一致,您可以利用继承:
a, a:visited, a:hover, a:active {
color: inherit;
}
Notice there is no need to repeat the rule for each selector; just use a comma separated list of selectors (order matters for anchor pseudo elements). Also, you can apply the pseudo selectors to a class if you want to selectively disable the special anchor colors:
注意,没有必要为每个选择器重复规则;只需使用逗号分隔的选择器列表(锚伪元素的顺序)。此外,如果您想选择性地禁用特殊锚定颜色,您可以将伪选择器应用到类中:
.special-link, .special-link:visited, .special-link:hover, .special-link:active {
color: inherit;
}
Your question only asks about the visited state, but I assumed you meant all of the states. You can remove the other selectors if you want to allow color changes on all but visited.
你的问题只问访问的州,但我认为你指的是所有的州。如果您希望允许除已访问之外的所有选项更改颜色,可以删除其他选择器。
#3
10
For :hover
to override :visited
, and to make sure :visited
is the same as the initial color, :hover
must come after :visited
.
For:hover to override:visited,并确保:visited与初始颜色相同,:hover must come after:visited。
So if you want to disable the color change, a:visited
must come before a:hover
. Like this:
因此,如果要禁用颜色更改,a:visited必须在a:hover之前。是这样的:
a { color: gray; }
a:visited { color: orange; }
a:hover { color: red; }
To disable :visited
change you would style it with non-pseudo class:
禁用:访问更改,您将使用非pseudo类进行样式化:
a, a:visited { color: gray; }
a:hover { color: red; }
#4
0
Either delete the selector or set it to the same color as your text appears normally.
要么删除选择器,要么将其设置为与文本正常显示的相同颜色。
#5
-2
You can solve this issue by calling a:link
and a:visited
selectors together. And follow it with a:hover
selector.
您可以通过一起调用a:link和a:已访问的选择器来解决这个问题。然后使用:hover选择器。
a:link, a:visited
{color: gray;}
a:hover
{color: skyblue;}
#6
-3
a:visited {
text-decoration: none;
}
but it will only affect links that haven't been clicked on yet.
但它只会影响尚未点击的链接。