css - 新しいクラスを要素に動的に追加するにはどうすればよいですか?

Question

の要素に新しい CSS クラスを追加する方法はあります:hoverか?

jQuery と同様ですが、CSS に変換されます。

$(element).addClass('someclass');

score 33 · Accepted Answer

短い答えいいえ:)

ただし、次のようにホバーに同じ CSS を使用することもできます。

a:hover, .hoverclass {
    background:red;
}

クラスを追加する必要がある理由を説明すれば、より良い解決策があるかもしれません。

score 22 · Accepted Answer

誰もがこれに対する jQuery/JS の回答を提供しているので、追加の解決策を提供します。あなたの質問に対する答えはまだいいえですが、LESS (CSS プリプロセッサ) を使用すると、これを簡単に行うことができます。

.first-class {
  background-color: yellow;
}
.second-class:hover {
  .first-class;
}

簡単に言えば、カーソルを合わせると、.second-classのすべてのプロパティが表示され.first-classます。ホバーするだけで、クラスが永続的に追加されるわけではないことに注意してください。LESS の詳細については、こちらをご覧ください: LESS の使用を開始する

これもSASSの方法です：

.first-class {
  background-color: yellow;
}
.second-class {
  &:hover {
    @extend .first-class;
  }
}

score 6 · Accepted Answer

CSS には、JavaScript と同じ方法でオブジェクトを変更する機能は実際にはありません。

score 3 · Accepted Answer

:hoverは疑似クラスなので、そこに CSS 宣言を入れることができます。

a:hover {
    color: #f00;
}

セレクターのリストを使用して、ホバーされた要素または特定のクラスの要素に CSS 宣言を適用することもできます。

.some-class,
a:hover {
    color: #f00;
}

score 0 · Accepted Answer

なぜ@Marco Berroclは否定的なフィードバックを受け取り、彼の答えは完全に正しいのですか?

だから私は答えではなくホバーすると思うし、彼は多くの場合jqueryまたはjavascriptを使うべきだ

score -2 · Accepted Answer

CSS のみを使用する、いいえ。追加するには jQuery を使用する必要があります。

8 に答える 8