在 jquery modal 对话框中定义 ui-widget-content 的边框

Question

我在一页上有两个模态。第一个的边框在.ui-widget-content 类的jquery.ui.theme.css 文件中定义。

有没有办法附加一个样式属性并覆盖css文件定义的那个？

我希望第二个模态有不同颜色的边框。

这是我的 div：

<div id="dialog-modal" title="Discharge Warning">
    <p>Are you sure you want to discharge this Patient</p>
</div>

这是我的第二个模态的 jQuery：

$('#dialog-modal').dialog(
{
    modal: true,
    autoOpen: false,
    resizable: false,
    draggable:false,
    show:
    {
        effect:"blind",
        duration:500
    },
    buttons: 
    {
        'discharge': 
        {
            text: 'Discharge Patient',
            click: function () { $('#DischargeReferralForm').submit(); },
            class: 'btn purple',
            style: 'font-family: "Segoe UI", Helvetica, Arial, sans-serif'
        }
    },

});

$('.ui-dialog-buttonpane')
    .find('button:contains("Discharge")')
    .prepend('<i class="icon-ok"></i>');

$('#DischargeMgs').click(function () { $("#dialog-modal").dialog("open"); });

仅供参考：页面检查跟踪的颜色返回到 ui-widget-content 类。

Answer 1

我仔细查看了 jQuery UI Dialog individual CSS styling 并添加到我的 css 文件中：

.ui-dialog-content1
{
    border-color:#6d1b81 !important;
}

到我的 jquery 文件：

dialogClass: 'ui-dialog-content1'