我正在尝试将jquery ui对话框的默认样式更改为与此类似的东西 –
我得到它关闭改变一些CSS在jquery ui ..
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: .8em;
}
.ui-widget-content {
background: #F9F9F9;
border: 1px solid #90d93f;
color: #222222;
}
.ui-dialog {
left: 0;
outline: 0 none;
padding: 0 !important;
position: absolute;
top: 0;
}
#success {
padding: 0;
margin: 0;
}
.ui-dialog .ui-dialog-content {
background: none repeat scroll 0 0 transparent;
border: 0 none;
overflow: auto;
position: relative;
padding: 0 !important;
}
.ui-widget-header {
background: #b0de78;
border: 0;
color: #fff;
font-weight: normal;
}
.ui-dialog .ui-dialog-titlebar {
padding: 0.1em .5em;
position: relative;
font-size: 1em;
}
HTML：
<div id="popup-msg">
<div id="loading">
<h2>Loading...</h2>
<h3>Please wait a few seconds.</h3>
</div>
<div id="success" title="Hurray,">
<p>User table is updated.</p>
</div>
</div>
但是当我添加这种风格时，它适用于我所有的对话框。有人可以告诉我如何避免这个问题。
谢谢。
解决方法
见
http://jsfiddle.net/qP8DY/24/
您可以像我所做的那样，将一个类(如我的示例中的“成功对话框”)添加到div#成功，直接在HTML中或JavaScript中添加到dialogClass选项。
$('#success').dialog({
height: 50,width: 350,modal: true,resizable: true,dialogClass: 'no-close success-dialog'
});
然后只需将success-dialog类添加到CSS规则中即可。要表示一个应用了两个(或更多)类的元素，只需将它们全部写在一起，两者之间不会有空格。例如：
.ui-dialog.success-dialog {
font-family: Verdana,sans-serif;
font-size: .8em;
}
