Cambiar el color de fondo con CSS

Siguiendo con el tema de los efectos con CSS, pero esta vez, cambiando el color de fondo de un texto al pasar el ratón.

EJEMPLO

HTML

<div id="Efecto_Hover">
<ul>
<li>
<a href="#">Cabecera numero uno
<span class="descripcion">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque nonummy, lorem eget scelerisque ullamcorper, pede lacus bibendum sapien, non pellentesque erat elit vitae lorem.
</span>
<span class="categoria">CSS</span></a>
</li>
<li>
<a href="#">Cabecera numero dos
<span class="descripcion">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque nonummy, lorem eget scelerisque ullamcorper, pede lacus bibendum sapien, non pellentesque erat elit vitae lorem.
</span>
<span class="categoria">Photoshop</span></a>
</li>
<li>
<a href="#">Cabecera numero tres
<span class="descripcion">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque nonummy, lorem eget scelerisque ullamcorper, pede lacus bibendum sapien, non pellentesque erat elit vitae lorem.
</span>
<span class="categoria">Recursos</span></a>
</li>
</ul>
</div>

CSS

#Efecto_Hover ul {
list-style-type: none;
width: 350px;
margin:0px;
padding:0px;
}

#Efecto_Hover li {
border: 1px solid #999;
border-width: 1px 0;
margin: 5px 0px;
}

#Efecto_Hover li a {
color: #900;
display: block;
font: bold 16px Arial, Helvetica, sans-serif;
padding: 2px;
text-decoration: none;
}

* html #Efecto_Hover li a {
width: 350px;
}

#Efecto_Hover li a:hover {
background: #F4F4F4;
}

#Efecto_Hover a .descripcion {
color: #333;
display: block;
font: normal 10px Verdana, Helvetica, sans-serif;
line-height: 125%;
}

#Efecto_Hover a .categoria {
color: #409209;
font: normal 9px Verdana, Helvetica, sans-serif;
line-height: 150%;
}

(Vía Webintenta)