0

我在绝对定位的 div 中有一个无序列表。我正在尝试对单个 li 元素进行悬停效果，但它根本不起作用。光标只有在 li 的文本上方相当高时才会触发悬停效果。

这是响应式设计布局中最宽的部分，悬停工作得很好，直到最宽的状态，出于设计考虑，我必须将包含的 div 切换到绝对位置，我已经进行了很多实验，它总是在没有绝对定位的情况下工作，但我根本无法将我的容器正确放置在最终状态，并将其从流中移除。

这把我逼疯了，我哪里错了？？

.secondary_header{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    position:absolute;
    width:700px;
    border-bottom-right-radius:60px;
    height:60px;
}   

.secondary_header ul{
    margin:0 auto;
    width:100%;
}

.secondary_header ul li{
    background-image:url(../images/audio_icon.png);
    background-repeat:no-repeat;
    background-position:0px;
    padding-left:50px;
    float:left;
    list-style:none;
    line-height:60px;
    padding-left:50px;
    height:60px;

}

.secondary_header ul li:hover{
   color:#09F;
}
4

1 回答 1

0

您提供的信息还不够。如果以下代码满足您的要求，那么请高兴，否则.. 详细说明您的要求，以便我有一个好主意。

.secondary_header{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    position:absolute;
    width:700px;
    border-bottom-right-radius:60px;
    height:60px;
}   

.secondary_header ul{
    margin:0;
    padding:0px;
    width:100%;
}

.secondary_header ul li{
    background-image:url(../images/audio_icon.png);
    background-repeat:no-repeat;
    background-position:0px;
    padding:0 15px;
    float:left;
    list-style:none;
    line-height:60px;
    height:60px;
    cursor:pointer;

}

.secondary_header ul li:hover{
   color:#09F;
}
于 2013-09-28T07:19:42.247 回答