首页 文章

如何用悬停改变li标签的背景颜色？

提问于
浏览 次
3

使用onMouseOver更改 li 标签的背景颜色的最佳方法是什么？我试过这种方式，但它不起作用：

生成HTML的代码：

echo "<a href=".$obj_players->Page." target=_parent>
      <li style=\"background-color:#FFFFFF;\"><span class=\"left\">" . $obj_players->Name . "</span><span class=\"right\">" . $obj_players->Viewers . "</span></li></a>";

CSS：

#navlist li:hover {
    background-color:#2EA620;
}

#navlist li {
    width:175px;
    height:30px;
    text-align:center;
    line-height:30px;
    font:"Myriad Pro";
    font-size:14px;
    padding-left:10px;
    padding-right:10px;
    border-bottom:1px solid;
    border-color:#333;
}

说明：我必须声明 li 标签中的背景颜色，因为我有不同的背景颜色的 li 元素 . 而且李在一个带有ID导航列表的 div 中 .

我也有一个问题，我不希望每个 li 都用onmouseover改变背景颜色，但我稍后会解决这个问题，因为我认为我应该能够自己管理它 .

html css

1 回答

  • 11

    您需要删除 background-color:#FFFFFF 内联，并将其添加到css . 然后 #navlist li:hover { background-color:#2EA620; } 应该工作 .

    示例：http://jsfiddle.net/jU8Pp/

    回复于

相关问题