css - jQuery UI ダイアログ ボタンの境界線/アウトラインを削除する

Question

JQuery UI ダイアログ ボタンのアウトラインを削除するには、どのクラスを変更/変更する必要がありますか。「X」ボタンの周りに境界線/アウトラインを適用しているクラスを特定できないようです。ボタンをクリックするとアウトラインが消えます。

私はこの CSS を使用しています: http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css

Answer 1

私は自分の質問を解決しました。Outline -colorには transparent/none オプションがないことが判明したため、クラスのOutline-widthをオーバーライドする必要がありました。だから私は設定した

outline-width: 0px !important;

Answer 2

そのボタンに境界線を適用するコードは次のとおりです (他のものも含まれますが、関連する部分だけをここに入れています)。

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border: 1px solid #D3D3D3;
}

その場合、<button>要素は 3 つのセレクターすべてに一致するため、次のようなセレクターを使用できます。

.ui-dialog-titlebar > .ui-button {
    border: 3px solid red;
}

ダイアログ ボタンのデフォルト スタイルをオーバーライドするには...

Jsbin デモ