サマリー:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>北京美團(tuán)網(wǎng)-北京美食_酒店_旅游_團(tuán)購_電影_吃喝玩樂</title>
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>北京美團(tuán)網(wǎng)-北京美食_酒店_旅游_團(tuán)購_電影_吃喝玩樂</title> <link rel="stylesheet" type="text/css" href="./1.css"> </head> <body> <nav> <div> <ul> <li style="color: #666666"><a>北京</a></li> <li style="color: #666666"><a>切換城市</a></li> <li><a>[ 大廠回族自治縣 廊坊 固安縣 ]</a></li> <li style="color: #29C0AD; margin-left:20px;" ><a>立即登錄</a></li> <li><a>注冊</a></li> </ul> </div> <div> <ul> <li><a >網(wǎng)站導(dǎo)航</a></li> <li><a>商家中心</a></li> <li><a>手機(jī)APP</a></li> <li><a>我的美團(tuán)</a></li> </ul> </div> </nav> <div class="clear"></div> </body> </html>
*{margin: 0;padding: 0;} ul li{list-style:none;} nav{background-color:#F8F8F8;height: 40px;width: 1200px;margin: 0 auto;} .nav_left{height: 40px;line-height: 40px;font-size: 12px;width: 600px;float:left;} .nav_left li{color: #999999;margin-left:5px;float:left;} .nav_right{height: 40px;line-height: 40px;font-size: 12px;width: 400px;float:right;} .nav_right li{color: #999999;float:right;margin-right:30px;} nav li a:hover{color: #29C0AD;} .clear{clear:both;}
由于頁面上不好引用字體庫,于是就沒有引用,只是做了一個簡單的導(dǎo)航欄.導(dǎo)航欄的布局基本上只要條理清晰,還是很好上手的.需要注意的是浮動的運用以及使用完后清除浮動.
添削の先生:韋小寶添削時間:2019-03-06 09:13:17
先生のまとめ:網(wǎng)站中的導(dǎo)航是很重要的 一個導(dǎo)航的樣式影響著整個網(wǎng)站