html - Bootstrap3 Navbar - 链接上的边框底部长度

Question

刚刚问了一个类似的问题，但结果我忽略了放置标签的位置。它已修复但产生了另一个问题。

为链接的悬停添加了一种样式，悬停时会出现边框:

.navbar-default .navbar-nav > li > a:hover {
    padding: 5px;
    color: white;
    border-bottom: #16b2d9 solid 3px;
}

但是一切正常，有没有办法根据文本的长度调整边框长度？

Answer 1

您可以使用下划线代替底部边框:

.navbar-default .navbar-nav > li > a:hover {
    padding: 5px;
    color: black;
    text-decoration:underline;
}

http://jsfiddle.net/gratiafide/goLk6gcf/3/