Twitter Bootstrap Popovers的HTML标记

Question

我试图弄清楚要用Bootstrap popovers这样的CSS类：

上面的例子类似于bootstrap文档中的第一个例子。

如何只使用标记获取上述类型的弹出框，而不需要使用javascript调用和点击？

Answer 1

将呈现弹出框的HTML看起来像这样：

<div class="popover right popover-example">
    <div class="arrow"></div>
    <h3 class="popover-title">Popover right</h3>
    <div class="popover-content">
        <p>Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
    </div>
</div>

但是，默认情况下，.popup为display: none，因此您可能希望覆盖;在这种情况下，我添加了一个类popover-example，并将定义以下附加CSS：

.popover.popover-example {
    display: block
}

Answer 2

<div class="popover right">
    <div class="arrow"></div>
    <h3 class="popover-title">Your title here</h3>
    <div class="popover-content">
        <p>Your content here</p>
    </div>
</div>

以您希望它显示的任何方式替换“正确”类。