I can't remove underlining from visited links. In my computer, the Fiddle below shows black, underlined text for the visited link in any browser (current versions of Chrome, Firefox and IE).
a:link { color: red; text-decoration: underline; }
a:visited { color: black; text-decoration: none; }
<p><a href="http://www.nevervisited.com">This link is not visited.</a></p>
<p><a href="http://www.google.com">This is link is visited.</a></p>
This is Chrome's inspector for the visited link.
I suspect a:visited
being grayed out has something to do with this, but this question about grayed out styles didn't do anything for me, though it helped many others.
These answers (this, this) suggest the spec doesn't care about child elements' text-decoration
when their ancestor has it defined, but I don't think this is the case here. My <a>
s don't have underlined parents, nor am I using pseudo-elements, but pseudo-classes.
Also, why does Chrome apply a:link
to the visited link, if W3C says that
The two states [
a:link
anda:visited
] are mutually exclusive.
Maybe this has to do with user agents hiding private info from websites, like W3C suggests right after the previous quote? This:
Note. 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 therefore treat all links as unvisited links, or implement other measures to preserve the user's privacy while rendering visited and unvisited links differently.
By setting the text-decoration to none to remove the underline from anchor tag. Syntax: text-decoration: none; Example 1: This example sets the text-decoration property to none.
The :visited CSS pseudo-class represents links that the user has already visited. For privacy reasons, the styles that can be modified using this selector are very limited.
Definition and Usage. The :visited selector is used to select visited links. Tip: Use the :link selector to style links to unvisited pages, the :hover selector to style links when you mouse over them, and the :active selector to style links when you click on them.
Visited Links are underlined/ highlighted or have a different font color (dependent upon your site design and color scheme) AFTER a site visitor visits the page. Visited Links stay underlined/ highlighted or have a different font color as the site visitor continues to navigate the website.
The only CSS property you can apply on a:visited
links in most Webkit-based browsers (like Safari) or Blink-based (Chrome and Opera) is color
. Anything else won't work. It has something to do with browser history stealing. You can read more about it from here:
http://seclists.org/fulldisclosure/2013/May/13
However you can change the style of all links with a {text-decoration: none;}
.
The selector itself is not dangerous, but if you combine it with Javascript's functions like getComputedStyle() things can get pretty ugly and by ugly I mean that other users can view and read your personal browser history.
Mozilla (Gecko engine) limited the selector properties to color
, background-color
, border-*-color
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With