我爱编程

改变bootstrap tooltip的样式

2018-05-23  本文已影响0人  lllhy

通常要改变框架原有的样式,常规的做法是找到设置该样式的选择器进行重写,有时为了不影响其他页面的显示或者涉及到选择器优先级的时候,

会在原选择器前加一级,使得影响范围更准确。

现在说的是改变bootstrap tooltip的样式:

1、改变气泡颜色以及小三角的颜色:

.tooltip-inner{

    background-color: #0e8ee7;

}

.tooltip.top .tooltip-arrow{

    border-top-color: #0e8ee7;

}

效果:

2、使用api的html来改变

title里面可以写html代码

然后,

$(function () {

        $(function () { $(".tooltip-options a").tooltip({html : true });   //html默认为false

}

使用html要注意,可能会造成 XSS 攻击,所以要慎用。

效果:

上一篇 下一篇

猜你喜欢

热点阅读