ホバー時に Div の背景色を変更してクリック可能にする方法

ホバー時に div の背景色を変更する方法

質問:

マウスホバー時に div の背景色を変更すると、div 全体ではなく div 内のリンクのみが色を変更します。色の変更を div 全体に拡張するにはどうすればよいですか?さらに、クリック時に div 全体をリンクとして機能させるにはどうすればよいですか?

回答:

この問題は、「a:hover」セレクターがのみに影響するために発生します。 div内の要素。 div 全体の色を変更するには、代わりに「div:hover」を使用する必要があります。

div 内の任意の場所をクリックすると指定されたアドレスに移動するように div の動作を変更するには、次の手順が必要です。 :

1. HTML ID を div に割り当てます:
2. CSS で、次の構文を使用して背景色を設定します: #myDiv: hover { background: grey;}
3. div をクリック可能にするには、cursor: pointer; を追加します。 CSS へ: #myDiv {cursor: pointer;}

グループ化された div の代替:

複数の div の背景色を変更したい場合は、 CSS クラスを割り当てます:

。次に、次の CSS を使用します: .myClass:hover {background: grey;}

追加のヒント:

• 特定のオブジェクトにのみホバー効果を適用するにはdiv の場合は、HTML ID セレクターを使用します。
• div のグループを変更するには、CSS クラス セレクターを使用します。

以上がホバー時に Div の背景色を変更してクリック可能にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。