I'm trying to make it so that when a link has been visited, it is persistently a certain color AND a certain opacity that matches non-visited links when WebKit fully transitions them.
Using this:
a:visited {
color:#cc7839;
opacity:0.1;
}
I can get the visited links to always be that color, except opacity isn't doing anything. I set it to 0.1 to make it easier to see if it was working.
When I hover over a visited link, it transitions to the opaque color set by WebKit for a:link:hover.
Here's the CSS that's in another file for setting all links:
a:link:hover,a:hover,a:visited:hover {
color: #cc7839;
opacity:0.8;
text-decoration:none;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
}
I'm thinking I have to change something with the latter CSS in terms of which a
elements it specifies?
If it's deselected (by default), you are good. Go to Step 2. Step 2: Now go to Content > Fonts & Colors > Colors. In the “Colors” windows, change the color of “Visited Links:” to your desired one, select Always in the drop-down menu, and click the “OK” button to save your changes.
The :visited pseudo-class selector can change some of the styling on an anchor link ( <a> ) element if the user's browser has already visited the link. It's meant to help users distinguish the difference between links they have and haven't visited.
To "unvisit" it, simply go back to that page and click that link again — that way, it will now be in your Chrome's recent history and you can delete it as described above. Save this answer.
Location pseudo-classes Matches an element if the element would match either :link or :visited . Matches links that have not yet been visited.
Not possible. You can only use the :visited
selector to change the color of an element. Thus opacity doesn't work.
SEC7115
:visited and :link styles can only differ by color.
Reference here - Was unable to find W3 documentation stating it..
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