Geek Answers Handbook

Background-image: for: visited links?

Can I add the background-image: property for visited links?

a.coolLinks:visited{ background-image:url("http://www.ledr.com/colours/black.jpg"); }

thanks

Edit: Thus, it seems that this is a security vulnerability, and therefore this cannot be done. There was no indication that browsers blocked this css style.

+6
source share
3 answers

Your code is correct according to most specifications. However, many browsers view background images on visited links as a potential violation of user privacy, so they do not allow this.

Check out this example:

 <p><a href="/unvisited">Unvisited link</a></p> <p><a href="http://jsfiddle.net/">Visited Link</a></p> <style> a { background:red url("http://placekitten.com/100/101?image=2") center center no-repeat; display: block; height: 200px; width: 200px; overflow: hidden; text-align: center; background-color: red; } a:visited { background:blue url("http://placekitten.com/100/100?image=1") center center no-repeat; } </style>

(Also at http://jsfiddle.net/Yq5GY/1/ ). Firefox ignores the background image ad for visited links and never displays a solo kitten. You can make some differences with the background color. In any case, this is a bad use to rely on images.

+11
source

As @KatieK suggested, most browsers were not allowed to set the background image (even some other rules, such as background-color) to :visited links, as this is a privacy issue. You can read about it using the following links:

+1
source

MDN specification for: visited , you will notice that the background image is not allowed.

+1
source

More articles:


All Articles