更改BootStrap popover的默认样式及popover简单用法

下面通过一段代码给大家介绍更改BootStrappopover的默认样式，具体代码如下所述：.popover{posit

下面通过一段代码给大家介绍更改BootStrap popover的默认样式，具体代码如下所述：

.popover {
 position: absolute;
 top: 0;
 left: 0;
 z-index: 1060;
 display: none;
 max-width: 276px;
 padding: 1px;
 font-size: 14px;
 font-weight: 400;
 line-height: 1.42857143;
 text-align: left;
 white-space: normal;
 background-color: #fff;
 -webkit-background-clip: padding-box;
 background-clip: padding-box;
 border: 1px solid #ccc;
 border: 1px solid rgba(0,0,0,.2);
 border-radius: 6px;
 -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
 box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

BootStrap popover弹出框默认样式，需修改弹出框样式可在CSS中自定义要修改的样式，例如：padding改为6px，背景颜色修改为黑色，字体颜色修改为白色

 .popover{
 padding:6px;
 background-color:#000;
 color:#fff;
}

补充：下面看下bootstrap popover简单用法

//添加

$('#freqsComboCheckbox').addClass('has-popover').attr('data-content', "Please Select Frequency!")
 .popover({
 placement: 'bottom',
 container: '.areaBox',//将popover附加到特定的元素上
 trigger: 'manual' //manual触发方式
 }).popover('show');

//移除

$(".has-popover").not($('#freqsComboCheckbox')).removeClass('has-popover').popover('destroy');

总结

以上所述是小编给大家介绍的更改BootStrap popover的默认样式及popover简单用法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！