0

私はJQueryボタンセットを使用しており、ホバーしたとき、またはアクティブなときにアイコンを色付きのバージョンに設定して、目立つようにしています。css は次のようになります。

.ui-button .ui-icon.line {
    background-image: url("/static/16x16/line-black.gif");
}
.ui-button.ui-state-hover .ui-icon.line {
    background-image: url("/static/16x16/line-color.gif");
}
.ui-button.ui-state-active .ui-icon.line {
    background-image: url("/static/16x16/line-color.gif");
}

上記のcssは正常に動作します。私の質問は、2 番目と 3 番目の CSS ルールを組み合わせる方法があるかどうかです。

私は、他のバリエーションの中で、これを試しました：

.ui-button .ui-icon.line {
    background-image: url("/static/16x16/line-black.gif");
}
.ui-button.ui-state-hover .ui-button.ui-state-active .ui-icon.line {
    background-image: url("/static/16x16/line-color.gif");
}

しかし、うまくいく組み合わせは見つかりませんでした。

1 つの CSS セレクターで 2 つの組み合わせ (.ui-button.ui-state-hover と .ui-button.ui-state-active) を組み合わせる方法はありますか?

4

1 に答える 1

1

You can separate multiple selectors with a comma:

.ui-button.ui-state-hover .ui-icon.line, .ui-button.ui-state-active .ui-icon.line {
    background-image: url("/static/16x16/line-color.gif");
}
于 2013-09-24T21:06:29.587 に答える