質問:
CSS トランジションを使用しているにもかかわらず、メニュー項目の背景色が変化します。ホバー時にスムーズに変化しません。関連する CSS は次のとおりです:
#content #nav a:hover { color: black; background-color: #AD310B; -moz-transition: all 1s ease-in; -webkit-transition: all 1s ease-in; -o-transition: all 1s ease-in; transition: all 1s ease-in; }
回答:
トランジションが正しく機能するにはブラウザのサポートが不可欠です。この記事の執筆時点では、移行は以下でサポートされています:
目的のフェード効果を実現するには、次の点を考慮してください。次の CSS:
a { background-color: #FF0; } a:hover { background-color: #AD310B; -webkit-transition: background-color 1000ms linear; -ms-transition: background-color 1000ms linear; transition: background-color 1000ms linear; }
これにより、サポートされているブラウザで背景色の遷移が確実に機能し、メニュー リンクの上にマウスを移動したときに滑らかなフェード効果が作成されます:
<a>Navigation Link</a>
以上がホバー メニューの背景がスムーズに移行しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。