自定义jQuery对话框关闭按钮

Question

我在我的应用程序中有很多jQuery-ui对话框，我试图自定义关闭按钮的对话框，因为我试图删除一些默认类，试图删除悬停类（ui-state-hover）并试图删除自动对焦功能。

目前，我已经添加了下面的代码实现对话功能的open选项相同： -

$('button[title="close"].ui-dialog-titlebar-close') 
    .removeClass("ui-button-icon-only ui-state-default ui-button ui-widget") 
    .hover(function() { $(this).removeClass("ui-state-hover"); }) 
    .blur() 
    .css({ "border": "none" }); 

虽然，这是一整天努力，因为它似乎很丑陋，我后，我的最后一个选项。我自己也尝试在这样我的自定义CSS文件覆盖默认悬停&重点班： -

.ui-state-hover { background: none!important; border:none!important;} 
.ui-state-focus { outline-color: transparent !important; } 

我已确保我的自定义CSS后jQuery-ui.css文件，但仍然没有运气出现。有没有更好的方法来做到这一点？我想为我的应用程序中的所有对话框执行此操作。

Answer 1

改变悬停和重点国家CSS，你需要覆盖整个规则如下

CSS

.ui-state-hover, 
.ui-widget-content .ui-state-hover, 
.ui-widget-header .ui-state-hover, 
.ui-state-focus, 
.ui-widget-content .ui-state-focus, 
.ui-widget-header .ui-state-focus { 
    background: none!important; 
    border:none!important; 
    outline:none!important; 
} 

编辑：

指究竟如何CSS越来越适用，请请参考我在本文中的回答：How can I exclude one html view in whole project to be applied from CSS?