html - 将悬停样式应用于 li :last-child link

Question

我在列表末尾设置了一个元素的样式，看起来不错，但我似乎无法对悬停状态进行任何更改:

div#navigation li a{color:#73737a;} 
div#navigation li a:hover{color:#3ca2e0;} 
div#navigation li:last-child{
  border-radius:6px;   
 -webkit-border-radius: 6px; 
 -moz-border-radius: 6px;
  border: 1px solid #e0e0e0; padding:6px 9px; color: #fff;
  background-color: blue;     
}

div#navigation li:last-child:hover{
background-color:orange;
}

我注意到 li:last-child:hover 没有“Anchor”引用，这可能是问题所在吗？

感谢您的关注!

Answer 1

div#navigation li a{color:#73737a;}
div#navigation li a:hover{color:#3ca2e0;} 
div#navigation li#last-child{
  border-radius:6px;   
-webkit-border-radius: 6px; 
-moz-border-radius: 6px;
border: 1px solid #e0e0e0; padding:6px 9px; color: #fff;
background-color: blue;}

div#navigation li#last-child:hover{
background-color:orange;}

将您的 (li:last-child) 定义为一个 ID，然后应用悬停属性...希望它会有所帮助...