HTML CSS examples for CSS Widget:Hover on list
Compare (.className:hover li a) and (.className li a:hover)
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .amenu, .bmenu {<!-- w ww . jav a2s. co m--> background:green; height:51px; width:301px; display:block; } li a { background:Red; width:100px; display:block; } .amenu:hover li a { color:Chartreuse; background:yellow; } .bmenu li a:hover { color:yellow; background:yellow; } </style> </head> <body> <div class="amenu"> <ul> <li> <a href="#">one</a> </li> <li> <a href="#">two</a> </li> </ul> </div> <br> <br> <div class="bmenu"> <ul> <li> <a href="#">one</a> </li> <li> <a href="#">two</a> </li> </ul> </div> </body> </html>