Question

我有以下div：

<span data-placement="bottom" data-toggle="popover" data-container="body">Press Me!</span>

使用以下弹出窗口：

  <div id="popover-content" class="hide"> ... </div>

如何从弹出窗口中删除箭头？

Answer 1

.popover.bottom .arrow {visibility：hidden;}

Answer 2

您可以添加CSS，您可以在其中选择弹出框，然后选择箭头。之后，您可以自定义箭头并最终隐藏它。

.popover .arrow {
    display: none;
}

Answer 3

另一种实现方法是，如果需要设置template弹出框选项，默认情况下，该选项为以下选项：

'<div class="popover">
  <div class="arrow"></div>
  <h3 class="popover-title"></h3>
  <div class="popover-content"></div>
</div>'

您可以简单地排除以下div元素：

<div class="arrow"></div>

如果您需要更多信息，可以访问以下网站：

Answer 4

我正在使用reactstrap，这对我有用：

<Popover ... hideArrow={true}>