ホームページ > ウェブフロントエンド > htmlチュートリアル > CSS マウスは、menu_html/css_WEB-ITnose を通過すると色が変わります

CSS マウスは、menu_html/css_WEB-ITnose を通過すると色が変わります

WBOY
リリース: 2016-06-21 09:28:22
オリジナル
1783 人が閲覧しました

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>#navigation{	width:200px;	font-family:Arial,		}	#navigation ul{		 list-style-type:none;		 margin:0px;		 padding:0px;		 				}		#navigation ul li{			border-bottom:1px solid #ed9f9f;									}#navigation ul li a{	 display:block;	 padding:5px 5px 5px 0.5em;	 text-decoration:none;	 border-left:12px solid #711515;	 border-right:1px solid #711515;		}			body{		 background-color:#FFC;		}#navigation li a:link,#navigation li a:visited{		background-color:#c11136;		 color:#ffffff;}#navigation li a:hover{					/* 鼠标经过时 */     	background-color:#990020;			/* 改变背景色 */	color:#ffff00;						/* 改变文字颜色 */}</style></head><body><div id="navigation"> <ul>  <li><a href="#">Home</a></li>    <li><a href="#">My Blog</a></li>      <li><a href="#">Friends</a></li>        <li><a href="#">Next Station</a></li>          <li><a href="#">Contact Me</a></li></div></body></html>
ログイン後にコピー



#navigation li a:link,#navigation li a:visited{
background-color:#c11136;
color:#ffffff
}
この段落は次のように書きました
#navigation ul li a:link , #navigation ul li a:visited{
background-color:#c11136;
color:#ffffff;
}
(li の前に余分な ul があることに注意してください) メニューの色の変更効果が実現できないのはなぜですか?指定したulタグの下にマウス通過イベントをin liで表現するのは正しいでしょうか?なぜ不可能ではないのでしょうか?


ディスカッションへの返信(解決策)

投稿者がコードをコピーしましたが、A タグの疑似接続属性は正常です。

#navigation li a:link,#navigation li a:visited{
background-color:#c11136;
color:#ffffff;
} を
#navigation li a:link,#na vigation ulli a: に書き換えます。 Visited{
background-color:#c11136;
color:#ffffff; }

以下の pseudo-connection 属性にも ul を追加する必要があります。

ありがとうございます 分かりました

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート