我在<ul>标签中添加了一个文本和一个按钮,如下所示:
<body>
<div class="container">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#">Database</a></li>
<li role="presentation"><a href="#">Tasks</a></li>
<li role="presentation"><a href="#">Options</a></li>
<li role="presentation">Welcome, ${sessionScope.currentUser} <button type="submit" >Log out</button></li>
</ul>
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
结果是:

如果我将文本和按钮包裹在<a>标签内,则底线被推得太远.您可以看到"数据库"选项卡底部有一行.
我希望文本和按钮移动到选项卡组件的末尾,就像这个论坛的选项卡一样.文本"2 Answers"与选项卡"votes"具有相同的高度,位于选项卡窗格的边缘:

我知道我必须用JavaScript修改它,但我不知道该怎么做.