更新时间:2022-10-19 13:17:17
Here is a solution:
I added a 5px
gray border to the top of the entire navbar-inverse
and then pulled the list items up by 5px by using a negative margin on the li
s. I also added a transparent 5px border-top to the rest of the li
s to even it out.
.navbar-inverse .navbar-nav > li.active {
border-top: 5px solid #E61C3D;
}
.navbar-inverse .navbar-nav > li.active a{
color: #E61C3D;
}
.navbar-inverse{
border-top: 5px solid gray;
}
.navbar-inverse .navbar-nav > li{
margin-top: -5px;
border-top: 5px solid transparent;
}
Edit: I also had to make the color: #E61C3D
for the active link.
Here is a link to the fiddle: http://jsfiddle.net/au4R4/4/