如何更改引导弹出窗口的大小

Question

我正在尝试在页面上的元素上实现弹出窗口，以用于教程级别。但是，我似乎无法弄清楚如何增加箭头的大小。我正在使用Bootstrap 3.4.0。

当前看起来像这样：

这是我当前的 CSS ：

class Foo {
    private final GryoMapper MAPPER = GryoMapper.build().create();
}

这是 HTML ：

.popover {
  background-color: rgb(214, 245, 233);
}
 /* Right */
.popover.right .arrow:after {
  border-right-color: rgb(97, 95, 3);
}
.popover.right{
  border: 5px solid rgb(10, 10, 10);
}
/* Left */
.popover.left .arrow:after {
  border-left-color: rgb(10, 10, 10);
}
.popover.left{
  border: 5px solid rgb(10, 10, 10);
}
/* Top */
.popover.top .arrow:after {
  border-top-color: rgb(10, 10, 10);
}
.popover.top{
  border: 5px solid rgb(10, 10, 10);
}
/* Bottom */
.popover.bottom .arrow:after {
  border-bottom-color: rgb(10, 10, 10);
}
.popover.bottom{
  border: 5px solid rgb(10, 10, 10);
}

使用jQuery通过

添加内容

<div class="blocklyDiv" id="blocklyDiv" data-container="body" data- 
html="true" data-toggle="popover" data-placement="right"></div>

我对此很陌生，因此，如果您可以假设我不知道很多身份证件将不胜感激。

Answer 1

Twitter基于less

// Tooltips and popovers
// -------------------------
@tooltipColor:            #fff;
@tooltipBackground:       #000;
@tooltipArrowWidth:       5px;
@tooltipArrowColor:       @tooltipBackground;

@popoverBackground:       #fff;
@popoverArrowWidth:       10px;
@popoverArrowColor:       #fff;
@popoverTitleBackground:  darken(@popoverBackground, 3%);

// Special enhancement for popovers
@popoverArrowOuterWidth:  @popoverArrowWidth + 1;
@popoverArrowOuterColor:  rgba(0,0,0,.25);

如果使用了sass，请尝试理解此SASS Variables。

也请提及您的HTML，以获取更多说明