twitter-bootstrap - twitter bootstrap nav 堆叠列表自定义

Question

嗨，前端开发人员和其他对此主题感兴趣的人。我对引导组件之一有疑问，即使用nav nav-tabs nav-stacked类进行ul列表自定义。

经典的变体是这个

<ul class="nav nav-tabs nav-stacked">
    <li><a href="lala">lala</a></li>
    <li><a href="baba">baba</a></li>
</ul>

看起来像这样：

但是如果我想在其中的每个堆叠选项卡的右侧添加某种链接/按钮怎么办？如果我在li标签中省略了一个标签，那么酷的边框，who-tab-hover 效果就消失了。所以有什么方法可以做到这一点，所以我可以继续使用类nav nav-tabs nav-stacked 的引导链，并能够在选项卡上放置第二个 url（在某种程度上，整个选项卡仍然链接到指定的href，但正确放置的人员，例如带有btn类的人员？

我试过这段代码：

<ul class="nav nav-tabs nav-stacked">
    <li>
        <ul class="inline">
            <li><a href="lala">lala</a></li>
            <li class="pull-right"><a href="baba" class="btn btn-info">bbb</a></li>
        </ul>
    </li>
    <li><a href="baba">baba</a></li>
</ul>

它不起作用，我的意思是，是的，我确实有一个超链接，并且我确实有一个按钮，拉到右边，但我没有它周围的边框和所有活动区域。

如果有不清楚的地方——我会说得更清楚。真诚的，谢尔盖

Answer 1

选项卡是使用锚创建的，因此您可以将右对齐按钮放在锚标记中：

<ul class="nav nav-tabs nav-stacked">
    <li><a href="lala">lala <button class="pull-right">bbb</button></a></li>
    <li><a href="baba">baba</a></li>
</ul>

演示- http://bootply.com/60855