????：<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>北京美團網(wǎng)</title> &n
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>北京美團網(wǎng)</title> <link rel="stylesheet" type="text/css" href="demo.css"> </head> <body> <div> <nav> <ul class="nav_left"> <li><a href="">北京</a></li> <li><a href="">切換城市</a></li> <li><a href="">[ 大廠回族自治縣 廊坊 固安縣 ]</a></li> <li><a href="" style="color: #13D1BE;margin-left: 25px;">立即登錄</a></li> <li><a href="">注冊</a></li> </ul> <ul class="nav_right"> <li><a href="">網(wǎng)站導航</a></li> <li><a href="">商家中心 <ul> <li>登陸商家中心</li> <li>美團智能收銀</li> <li>我想合作</li> <li>手機免費開店</li> <li>餐飲代理商招募</li> <li>商家申請開票</li> <li>免費合作美團排隊</li> </ul> </a></li> <li><a href="">手機app</a></li> <li><a href="">我的美團 <ul> <li>我的訂單</li> <li>我的收藏</li> <li>抵用券</li> <li>賬戶設置</li> </ul> </a></li> </ul> </nav> </div> <div class="clear"></div> </body> </html>
*{margin: 0;padding: 0}
.clear{clear: both;}
ul{list-style: none;}
a:link{text-decoration:none;color:#999;}
a:visited{color:#999;}
div{width: 100%;background-color: #F8F8F8;}
nav{width: 1200px;height: 40px;margin: 0 auto; }
.nav_left a{float: left;line-height: 40px;margin-left: 10px;font-size: 12px;}
.nav_right a{float: right;line-height: 40px;margin-right: 30px;font-size: 12px;position: relative;}
nav a:hover{color: #13D1BE;}
.nav_right a ul{display: none;line-height: 35px;}
.nav_right a:hover ul{display: block;color:#999;position: absolute;width: 140px;}
.nav_right a ul li:hover{color: #13D1BE;}二級菜單需要用到一個定位的只是和display的一個none屬性，而且設置樣式也比較繁瑣，總的來說只要細心就能慢慢寫出來
?? ???：天蓬老師?? ??：2019-03-08 14:25:10
???? ??：布局的屬性并不多, 但是細節(jié) 卻很多 ,只有多寫,多想,才能掌握