ULのナビゲーションメニューのグラフィックとテキストの作成例

最初上図，最終結果：

HTML代：

• メニュー


• メニュー メニュー


• メニュー


• メニュー メニュー メニュー


• メニュー メニュー

< /div>

CSS代番号：

#qwe{
width: 200px;
font-family: "微软雅黑";
margin: 50px ;
}
#qwe ul{
list-style-type: none;
パディング: 0;
}
#qwe ul li a{
テキスト装飾: なし;
表示: ブロック;
幅: 200px;
高さ: 25px;
border-left: 10px ソリッド #333333;
border-right: 1px ソリッド #666666;
border-bottom: 1px ソリッド #555555;
padding-left: 3px;
margin-bottom: 1px;
}
#qwe ul li a:link,#qwe ul li a:visited{
color: 深紅;
背景色: #999999;
}
#qwe ul li a:hover{
color: 緑;
背景色: #777777;
}
#qwe ul li a:active{
color: darkorange;
}

备注：その中に含まれる伪类的配置

以上がULのナビゲーションメニューのグラフィックとテキストの作成例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

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