Question

我希望在我的导航栏下面有一个简单的薄边框，只有在我悬停的链接下才会变粗。我尝试使用以下代码执行此操作，但由于某些原因它不起作用。我如何使它工作？

#top-menu ul li a
{
    display: block;
    float: left;
    width: 80px;
    max-height: 15px;
    text-align: center;
    margin: 0;
    padding: 10px 0;
    text-decoration: none;
    font-size: 11pt;
    color: rgb(0,0,0);
    background-color: rgb(255,255,255);
    bottom-border: rgb(0,0,0) solid 2px;
}

#top-menu ul li a:hover
{
    bottom-border: rgb(0,0,0) solid 4px;
}

Answer 1

border-bottom而非bottom-border

Answer 2

为导航栏指定2px底部边框。

为您的导航链接提供一个2px的底部边框并将其设置为透明或导航栏的颜色（这将使边框看起来不存在）。

当悬停在导航链接上时，更改导航链接边框颜色以匹配导航边框。

这会给人的印象是该边框的边框较厚。

为什么此代码不在导航栏下创建边框？

2 个答案: