自定义Bootstrap Nav-Tabs的边界线

Question

如何自定义默认情况下的nav-tabs边界的颜色？我可以更改颜色内容div：http://jsfiddle.net/cjz9dyen/

我尝试了：

.nav-tabs > li.active > a {
    border-color: #d45500;
}

，但在底部添加了一个边框。

Answer 1

也覆盖border-bottom-color：

.nav-tabs>.active>a, .nav-tabs>.active>a:hover, .nav-tabs>.active>a:focus {
    border-color: #d45500;
    border-bottom-color: transparent;
}
.nav-tabs {
   border-bottom: 1px solid #d45500;
}

http://www.bootply.com/gjjxwz6eoz

Answer 2

bootstrap 5：

.nav-tabs a.nav-link.active,
.nav-tabs a.nav-link.active:hover,
.nav-tabs a.nav-link.active:focus {
    border-color: #d45500;
    border-bottom-color: transparent;
}
.nav-tabs, .nav-tabs a.nav-link {
    border-bottom: 1px solid #d45500;
}