twitter bootstrap导航堆叠列表自定义

Question

嗨前端开发人员和其他所有人都对这个主题感兴趣。 我有一个关于bootstrap组件的问题，即使用 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 ，但是右侧工作人员，例如 a ，类 btn ？< / p>

我试过这段代码：

<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>

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

如果事情不清楚 - 我会更清楚。 真诚的，谢尔盖

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