twitter-bootstrap 按钮组中的 bootstrap 3 垂直线
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21697659/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-10-21 20:01:05 来源:igfitidea点击:
bootstrap 3 vertical line in button group
提问by Alexandr Sulimov
Button group
按钮组
<button type="button" class="btn btn-default pull-left">
<span class="glyphicon glyphicon-chevron-left"></span>
<span id="prevBtn">06.02.2014</span>
</button>
<button type="button" class="btn btn-default pull-left">
<span id="nextBtn">08.08.2014</span>
<span class="glyphicon glyphicon-chevron-right"></span>
</button>
<button type="button" class="btn btn-default pull-left">
<span id="toDayBtn">Today</span>
</button>
How create vertical divider with bootstrap 3?
如何使用 bootstrap 3 创建垂直分隔线？
采纳答案by Alexandr Sulimov
My result
我的结果
<div style="border-right: 1px solid #C0C0C0; margin-left: 20px; float: left; height: 34px">
</div>
<button type="button" class="btn btn-default pull-left" style="margin-left: 20px;">
<span id="toDayBtn">Today</span>
</button>
回答by zessx
Here is a .btn-separatorclass to fit your needs :
这是一个.btn-separator适合您需求的课程：
<div class="container">
<div class="row">
<button type="button" class="btn btn-default pull-left">
<span class="glyphicon glyphicon-chevron-left"></span>
<span id="prevBtn">06.02.2014</span>
</button>
<button type="button" class="btn btn-default pull-left">
<span id="nextBtn">08.08.2014</span>
<span class="glyphicon glyphicon-chevron-right"></span>
</button>
<span class="btn-separator"></span>
<button type="button" class="btn btn-default pull-left">
<span id="toDayBtn">Today</span>
</button>
</div>
</div>
.btn-separator:after {
content: ' ';
display: block;
float: left;
background: #ADADAD;
margin: 0 10px;
height: 34px;
width: 1px;
}
回答by Josh Petitt
If you put your other buttons in their own group on a btn-toolbar, then this works pretty well
如果您将其他按钮放在 btn 工具栏上的它们自己的组中，则效果很好
<div class="btn-group" role="group">|</div>
