ホームページ >ウェブフロントエンド >CSSチュートリアル >ボタンをホバー色の変更のターゲットに正しく設定するにはどうすればよいですか?

ボタンをホバー色の変更のターゲットに正しく設定するにはどうすればよいですか?

DDD
DDDオリジナル
2024-11-02 05:04:30356ブラウズ

How to Correctly Target a Button for Hover Color Change?

ホバー時にボタンの色を効果的に変更する方法

ホバーしたときにボタンの色を変更するには、次の手順に従います。

「a.button a:hover」は、ホバーされているボタン内のリンクをターゲットにしているため、提供されたコードは機能しません。代わりに、「a.button:hover」を使用して、ホバーされたときにボタンを直接ターゲットにします。

修正されたコードは次のとおりです:

a.button {
  display: -moz-inline-stack;
  display: inline-block;
  width: 391px;
  height: 62px;
  background: url("img/btncolor.png") no-repeat;
  line-height: 62px;
  vertical-align: text-middle;
  text-align: center;
  color: #ebe6eb;
  font-family: Zenhei;
  font-size: 39px;
  font-weight: normal;
  font-style: normal;
  text-shadow: #222222 1px 1px 0;
}
a.button:hover {
  background: #383;
}

この変更により、ホバーされたときにボタンの色が正常に変更されます。終わりました。

以上がボタンをホバー色の変更のターゲットに正しく設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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