如何使用 CSS 将导航栏更改为选项卡？

Question

我想使用 CSS 将导航栏更改为选项卡，我知道我可以使用 angular-ui，但我想使用 CSS 来实现它。在这方面的任何帮助将不胜感激。

ma​​in.html

<nav class="navbar navbar-default">
    <div >
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li ui-sref-active="active"><a ui-sref="app.dit">DIT</a></li>
                <li ui-sref-active="active"><a ui-sref="app.st">ST</a>
                <li ui-sref-active="active"><a ui-sref="app.uat">UAT</a></li>
                <li ui-sref-active="active"><a>PROD</a></li>
            </ul>
        </div>
    </div>
</nav>

Answer 1

您可以根据需要使用“引导选项卡”类并根据需要更改 CSS。

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_pills_dynamic&stacked=h

这是代码