I have some trouble to find a css solution for having an active anchor colored...
Why are the active anchors not red so that if clicked on "momo" momo keeps red? Or is active the wrong pseudoclass for that?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>test</title>
<style type="text/css">
a:active{
color:red;
}
a:hover{
color:yellow;
}
</style>
</head>
<body>
<ul> Navigation
<li class="subli"><a href="#momo">momo</a></li>
<li class="subli"><a href="#ipsi">ipsi</a></li>
</ul>
</body>
</html>
Thanks Juru
:active means "While being activated" e.g. when it is focused and the enter key is pressed or while it is hovered and the mouse button is being depressed. (Note that since you have have :hover after :active you'll always override it for mouse activates)
There is no pseudo-class for "Anchor with an href value that resolves to the current location". For that you need to need to modify the HTML (preferably before it gets to the browser, but you can use JS as well).
Besides, you can use the target pseudo-class, which is pretty well supported already, to style the element referenced by the anchor.
<a href="#this-element">Click here.<div>
<div id="this-element">It's going to be red.<div>
<style>
#this-element:target{
color:red;
}
<style>
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