标签:
底部分类导航栏
↓↓↓↓↓↓↓↓↓代码↓↓↓↓↓↓↓↓↓↓↓↓↓↓
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>navv</title> <link rel="stylesheet" href="nav.css" > </head> <body> <nav> <div class="nav1"> <div class="left left1"> <img src="banner.png" alt=""> </div> <div class="right"> <img src="bg1.png" alt=""> </div> </div> <div class="nav1"> <div class="left"> <ul> <li><a class="fir" href="###">支付方式</a></li> <li><a href="###" href="###" href="###" href="###">货到付款</a></li> <li><a href="###" href="###" href="###" href="###">余额支付</a></li> <li><a href="###" href="###" href="###" href="###">物流运输</a></li> <li><a href="###" href="###" href="###" href="###">在线支付</a></li> </ul> </div> <div class="right"> <img src="bg2.png" alt=""> </div> </div> <div class="nav1"> <div class="left"> <ul> <li><a class="fir" href="###" href="###" href="###">支付方式</a></li> <li><a href="###" href="###" href="###">货到付款</a></li> <li><a href="###" href="###" href="###">余额支付</a></li> <li><a href="###" href="###" href="###">物流运输</a></li> <li><a href="###" href="###" href="###">在线支付</a></li> </ul> </div> <div class="right"> <img src="bg3.png" alt=""> </div> </div> <div class="nav1"> <div class="left"> <ul> <li><a class="fir" href="###" href="###">支付方式</a></li> <li><a href="###" href="###">货到付款</a></li> <li><a href="###" href="###">余额支付</a></li> <li><a href="###" href="###">物流运输</a></li> <li><a href="###" href="###">在线支付</a></li> </ul> </div> <div class="right"> <img src="bg4.png" alt=""> </div> </div> <div class="nav1"> <div class="left"> <ul> <li><a class="fir" href="###">支付方式</a></li> <li><a href="###">货到付款</a></li> <li><a href="###">余额支付</a></li> <li><a href="###">物流运输</a></li> <li><a href="###">在线支付</a></li> </ul> </div> </div> </nav> </body> </html>
*{ margin: 0px; padding: 0px; } nav{ width: 1349px; height: 180px; background: #63883C; } .left{ float: left; margin-top: 30px; margin-left: 20px; } .right{ float:right; margin-left: 60px; } a{ text-decoration: none; font-size: 14px; color:white; line-height: 25px; } a:hover{ text-decoration: underline; } .nav1{ float:left; } ul li{ list-style: none; } .fir{ color: #E8CF47; font-weight: bold; font-size: 18px; } .left1:first-child{ margin-left: 80px; margin-top: 0px; }
效果
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
标签:
原文地址:http://www.cnblogs.com/ivan-world/p/5944369.html