(来源:github)
(效果)
<div class="btn-group btn-group-sm"> <button class="btn btn-default active"> <span class="glyphicon glyphicon-eye-open" style="margin-right: 3px"></span> <span style="font-weight:700">Watch</span> <span class="caret"></span> </button> <button class="btn btn-default">3,064</button> </div>
ps:
<span class="caret"></span> 向下的箭头
, 这个朝下的箭头有两种方法,bootstrap方法如上,css办法如下:
.watch-tail::after {
content: "";
0;
height: 0;
vertical-align: -2px;
display: inline-block;
border: 4px solid;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
}
直接在watch-tail类后面添加一个伪类元素