Question

对于我的项目，我想要不同的弹出窗口用于不同的用途。所以我创建了一个新的css类。现在我想改变标题组件的样式（如下所示），方法与更改按钮的方式相同。

所以我的问题是：我可以像更改按钮的css一样更改标题的CSS吗？使用className属性。另外，我该怎么做？

bootbox.dialog({
    message: "<h4>" + errorMessage + "<h4>",
    title: $filter("translate")("Warning"),
    buttons: {
        no: {
            label: $filter("translate")("Cancel"),
            className: "c-btn-declined-selection c-btn-global-warning",
            callback: noCallback
        },
        yes: {
            label: $filter("translate")("Confirm"),
            className: "c-btn-confirm-selection c-btn-global-warning",
            callback: yesCallback
        }
    }

Answer 1

从阅读Bootbox.js documentation开始，似乎不存在固有的标题样式方法。这给你留下了两个选择......

<强> 1。在线添加样式/类：

bootbox.dialog({
    //...
    title: "<span style='color: red;'>This title is red</span>",
    //...
})

bootbox.dialog({
    //...
    title: "<span class="redText">This title is red</span>",
    //...
})

<强> 2。手动操作生成的元素

右键单击页面上的Bootbox对话框，然后转到 Inspect Element 。从这里，您将看到生成的内容，包括类和元素，您可以从中使用一些基本的CSS规则来设置样式。

例如，如果弹出式HTML看起来像这样......

<div class='bootbox-popup'>
    <h4 class='popup-title'></h4>
    <div class='popup-body'> ... </div>
</div>

您可以使用以下内容设置样式：

h4.popup-title {
    color: red;
}

Bootbox更改标题css

1 个答案: