CSS Tutorial for Beginners - 42 - Vertical menu Part 2 Video Lecture | Learn CSS: A Comprehensive Tutorial for Web Developers - Front-End Programming

so in the last video we developed our
vertical menu here in this video we're
going to add a hover effect to our menu
so that when we hover over our links the
color will change now the way this works
is if you have a darker color you want
to use a lighter color when the user
hovers over the link that will provide a
nice contrast and let the user know that
they are in fact over that particular
link so again if you have a darker color
you want to use a lighter color for the
hover and vice-versa so if our link was
a lighter color like a lighter green
here we would use a darker color for the
hover so several videos ago we talked
about States and you will remember that
I said that if you use effects we
actually have to use a different rule
set for those effects so when we create
our hover effect we're going to create
another rule set now it's pretty much
the same as this rule set we're just
going to add the hover attribute to our
anchor selector and so again we use a
colon and we just type in hover and of
course the first thing we want to do is
switch the color to a lighter color now
this hex code D 3 D 3 d3 creates a light
gray and this is kind of a standard
color that's used on a lot of menus so
let's go ahead and save our style sheet
and we'll refresh our page and there you
can see now we get this nice contrast
from a dark green to a light gray and
again that lets the user know that they
are hovered over a particular link but
we have one problem here and that is
this white text does not stand out well
against our light gray now it stands out
fine against the dark green but not
against our light gray so let's go ahead
and change that and we will change that
to a black color for our text so let's
go ahead and save our stylesheet and if
we hit refresh here and now you can see
we get black text against our light gray
and that stands out much better and so
this is looking pretty good now now in
the next video we're going to move on to
horizontal menus and then we're going to
actually start working with drop down
menus so I will see you guys in the next
video