如何在不填充的情况下更改bootstrap popover箭头边框颜色?

时间:2016-03-10 06:48:45

标签: jquery css twitter-bootstrap twitter-bootstrap-3 bootstrap-popover

我想更改弹框箭头的边框颜色。当我应用边框颜色时,箭头本身就会填充颜色。

我想只给出箭头边框的颜色和弹出体。

<p>Click on button to see Popover</p>

<a href="#" id="example" class="btn btn-primary" rel="popover"
   data-content="This is the body of Popover"
   data-original-title="Creativity Tuts">pop
</a>

$(function () {
    $('#example').popover();
});

Demo

2 个答案:

答案 0 :(得分:10)

您更改了.popover.right .arrow。因此,更改.arrow:after会更改&#34; fill&#34;箭头的颜色,如你所见,我设置为灰色。

.popover.right .arrow {
  border-right-color: aqua;
}

Fiddle

答案 1 :(得分:4)

.popover.right .arrow:after {
  border-right-color: white;
}
.popover.right .arrow {
    border-right-color: red;
}

updated fiddle