html - Bootstrap 导航栏链接边框

Question

我试图在我的 Bootstrap 导航栏中的一个链接周围放置一个边框，使其看起来像这里的这张图片。

我想简单地在 <li> 周围加上边框元素，但 Bootstrap 导航栏的边界 <li>与图片中的不同，元素会上升到导航栏的顶部和底部。这是我的努力的样子:

我尝试使用的 CSS 只是一个简单的边框:

#nav-signup {
    border: 1px solid #ACOLOR;
}

我尝试在链接周围设置边距，但这会使链接与其他链接不一致。我还尝试将 SIGN UP 按钮包装在一个 div 中，但这会使它失去很多 Bootstrap 属性。

有没有什么简单的方法可以让我在 SIGN UP 链接周围放置这个边框，而不必与 Bootstrap 作斗争？

谢谢

Answer 1

将文本包裹在 span 中并为其添加边框，谢谢。