Petite question sur HOVER et DIV

bonjour tous le mondes! je me trouve bloqué car j'ai fais plusieurs <div> pour ainserer les différents boutons de mon menu, et je voudrais faire un HOVER en css pour que l'image change a la survole du curseur :)
si quelqu'un a une solution, je laisse le code source.Merci

html:
<div id="bouton1">
</div>

<div id="bouton2">
</div>

<div id="bouton3">
</div>

<div id="bouton4">
</div>

<div id="bouton5">
</div>

<div id="bouton6">
</div>

css:
#bouton1
{
width: 91px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton1.png);
margin-left: 57px;
margin-top: -84px;
padding-top: 34px
}

#bouton2
{
width: 82px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton2.png);
margin-left: 146px;
margin-top: -84px;
padding-top: 34px
}

#bouton3
{
width: 98px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton3.png);
margin-left: 228px;
margin-top: -84px;
padding-top: 34px
}

#bouton4
{
width: 86px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton4.png);
margin-left: 326px;
margin-top: -84px;
padding-top: 34px
}

#bouton5
{
width: 95px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton5.png);
margin-left: 413px;
margin-top: -84px;
padding-top: 34px
}

#bouton6
{
width: 82px;
height: 50px;
border: 0px solid #FFFFFF;
background-image:url(images/bouton6.png);
margin-left: 508px;
margin-top: -84px;
padding-top: 34px
}