浮标

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>

效果

浮标样式

    改变浮标的样式

  .tooltip-inner {
    max- 200px;
padding: 3px 8px;
color: #fff;
text-align: center;
text-decoration: none;
background-color: red;
border-radius: 4px;
}
.tooltip.right .tooltip-arrow {
top: 50%;
left: 0;
margin-top: -5px;
border- 5px 5px 5px 0;
border-right-color: red;
}
  
原文地址:https://www.cnblogs.com/yaomengli/p/6693505.html