CSS – Div class hover Hover effect can be directly given to the elements but when it is applied to a particular element like div then the hover effect will be reflected to all the div elements. Using a class to apply the hover effect, gives us a choice to apply it on selective elements.
The :hover selector CSS pseudo-class is used to style elements when the mouse hovers over them. It can be used on every element.
color: inherit tells the a element to inherit the color from its parent, not its "normal" or "generic" state. Since :hover is simply a state of the a element, if you don't specify a color for a:hover then it will use whatever color that was already declared for it in, for example, an a rule.
Try this:
.menu a.main-nav-item:hover { }
In order to understand how this works it is important to read this the way the browser does. The a
defines the element, the .main-nav-item
qualifies the element to only those which have that class, and finally the psuedo-class :hover
is applied to the qualified expression that comes before.
Basically it boils down to this:
Apply this hover rule to all anchor elements with the class
main-nav-item
that are a descendant child of any element with the classmenu
.
Cascading is biting you. Try this:
.menu > .main-nav-item:hover
{
color:#DDD;
}
This code says to grab all the links that have a class of main-nav-item AND are children of the class menu, and apply the color #DDD when they are hovered.
Set a:hover based on class you can simply try:
a.main-nav-item:hover { }
how about
.main-nav-item:hover
this keeps the specificity low
try this
.div
{
text-decoration:none;
font-size:16;
display:block;
padding:14px;
}
.div a:hover
{
background-color:#080808;
color:white;
}
lets say we have a anchor tag used in our code and class"div" is called in the main program. the a:hover will do the thing, it will give a vampire black color to the background and white color to the text when the mouse is moved over it that's what hover means.
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