How to change the color of a link when mouseover?

Question

How to change the color of a link when mouseover?

Navigation

#1 by (5 votes)

2

I have a horizontal menu with links (example): Home; About; Contacts;

The idea is that the home always has the green background padding and the rest of the white background links. When the mouse is over the other links the background changes color to green (li: hover).

html css

asked by anonymous 17.08.2014 / 02:00

1 answer

Clear a datagridview in C # How to insert values from a Select field into the database

score 5 · Accepted Answer

This is very basic, I suggest you study a little more about classes, and their properties, a good place to learn a lot is at W3Schools .

In any case, here is a small example:

CSS:

ul {
    list-style:none;
}
li {
    width: 100px;
    height:36px;
    line-height:36px;
    text-align: center;
    display:inline-block;
}
li:hover, .active {
    background-color:#00ff00!important;
}

HTML:

<ul>
    <li class="active">Home</li>
    <li>Produtos</li>
    <li>Download</li>
    <li>Contatos</li>
</ul>

JSFiddle