Question

纽贝问题。

当我在菜单项上执行鼠标悬停时，只会突出显示固定区域。问题是菜单上的下一个项目由2个长单词组成，悬停不会覆盖所有单词，只是其中的一部分。以下是实现它的代码：

navlist {
    margin-left: -3px;
    padding-left: 0px;
    white-space: nowrap;
    position: absolute;
    height: 26px;
    width: 777px;
    top: 225px;
    background: url(images/mb2.jpg) repeat-x top left;
    font-family: Arial;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 20px;
}
#navlist li {
    display: inline;
    list-style-type: none;
}
#navlist li a {
    padding: 3px 10px;
    height: 20px;
    width: 91px;
    display: inline;
    position: absolute;
    text-align: center;
    color: #FFF;
    text-decoration: none;
    margin-top: 5px;
}
#navlist li a span {
    padding: 3px 10px;
    height: 20px;
    width: 71px;
    display: inline;
    position: absolute;
    text-align: center;
    color: #FFF;
    text-decoration: none;
    margin-top: -5px;
    font-weight: bolder;
}


#navlist a:hover {
    background: #0687eb;
    height: 10px;
    cursor: pointer;
}

它是否可以修复（覆盖菜单项的两个单词？我尝试使用宽度：91px;值 - 问题是它可以增加被覆盖的区域但是它变得很长并且侵犯了其他当你覆盖第一个菜单项时）

感谢。理想情况下，我想仅突出显示文本（文本字母） - 但不确定是否可以;对于2个单词的项目可以做到这一点）

谢谢。

Answer 1

你的两行文字和第二行的链接是否不能悬停？如果是这样，请尝试从#navlist li a span移除高度。这可能有所帮助，但也可以打破布局。

：悬停只覆盖固定区域？

1 个答案: