Question

我在使用.dialog()框重写css主题时遇到问题。我按照http://api.jqueryui.com/dialog/#theming的说明操作，但我无法解决此问题。我在dialogClass窗口小部件中使用.dialog()选项，因此它应该将我应用的样式附加到它们，如下所示：

Javascript初始化：

$("#modal").dialog({
   dialogClass: "css" 
});

HTML：

<div id="modal"></div>

CSS：

.css .ui-dialog-content { 
    border:1px solid #ddd; 
    background-color:#333; 
    padding:50px !important; }

好的，所以文档说我可以设置.ui-dialog-content类和对象的样式，它可以工作，SOMEWHAT。边框和背景颜色有效，但填充不起作用，因为它在element.style中设置样式，即使使用!important也不会覆盖它，所以它基本上不会让我更改任何前现有的模态类设置，即使使用!important，我想知道是否有人知道如何让它工作，首先让padding在.ui-dialog-content类上工作。

你可以在这里看到一个小提琴：http://jsfiddle.net/Tsy52/

Answer 1

让我们以min-height为例。

内联样式为min-height:28px

如果您想更改将CSS添加到该类无效，因为内联样式的特异性大于CSS

的特异性

顺序就是这样

!important > inline styles > class property

使用!important是一个糟糕的模式，必须避免。在这种情况下，您可以直接在元素上设置CSS属性。

$('.ui-dialog-content').css("min-height", "100px")

初始化对话框后。

无法覆盖.dialog（）小部件中的某些css对象主题

1 个答案: