クリックすると色を変えたいdivがあります。全部で3つのdivがあり、クリックするとどれがアクティブなdivかを示すようにしたいのです。
基本的に、CSS のアクティブ プロパティを使いたいのですが、マウス アップが発生したときに特定の div が元に戻らないようにしたいのです。フォーカスのようなものです。また、役立つ場合は、bootstrap も使用しています。
以下はHTMLの例です
<div>
Section 1
</div>
<div>
Section 2
</div>
<div>
Section 3
</div>
JavaScript を使用せずにこれを実現する方法を教えてください。
ベストアンサー1
tabIndex を追加して、DIV をフォーカス可能にします。
<div tabindex="1">
Section 1
</div>
<div tabindex="2">
Section 2
</div>
<div tabindex="3">
Section 3
</div>
:focus
次に、疑似クラスを簡単に使用できます
div:focus {
background-color:red;
}