I am using Bootstrap.
Bootstrap defines
a:hover, a:focus { color: #005580; text-decoration: underline; }
I have this links / CSS-classes
<a class="green" href="#">green text</a> <a class="yellow" href="#">yellow text</a>
How can I disable the hoover color?
I want the green links to stay green and the yellow ones yellow, without overriding :hover for every single class? (this question is not mandatory dependent to bootstrap).
I need something like
a:hover, a:focus { color: @nonhoovercolor; }
and I think
.yellow { color: yellow !important; }
is not a good practice.
To change the color of your link on hover, use the :hover pseudo property on the link's class and give it a different color.
To remove the CSS hover effect from a specific element, you can set the pointer-events property of the element (the hover behavior of which you want to disable) to “none”.
There are two ways that you can change the font color of the active nav-item. The default font-color is white of the active nav-link in the case of Bootstrap nav-active item. The first-way approach is to use a CSS styling file and changing the nav-item class when clicked.
if anyone cares i ended up with:
a { color: inherit; }
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