htmlnav
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>食日谈</title> </head> <style type="text/css"> *{padding: 0px;margin: 0px;} / .header{height: 73px;background: #fff;position: fixed;top:0;left:0;background: #fff;width: 100%;z-index: 999;} .pw{width: 1140px;margin: 0 auto;} .logo{float: left;padding: 12px 20px 0;margin: 10px;} .nav ul li{float: left;font-size: 16px;margin: 0 23px;list-style: none;padding-top:35px; } .nav ul li a{ color: #85847f;font-weight: 700;} .nav ul li ul{position: absolute;display: none;} .nav ul li ul li{float: none;} .er li{line-height: 0px;} .nav ul li:hover ul{display: block;} a{margin:0;padding:0;font-size:100%;background:transparent;text-decoration: none;} .login a{color: #666;line-height: 95px;margin: 0 0 0 20px;font-size: 12px;} .searchbtn {background: url(http://www.10ritan.com/images/header02.png) 50% no-repeat;padding: 50px; float: right;cursor: pointer;margin: -99px 40px 0px 0px;} </style> <body> <div class="content"> <!--头部文件--> <div class="header"> <div class="pw"> <div class="nav"> <div class="logo"><img src="http://www.10ritan.com//images/logo.png"></div> <ul class="ul"> <li><a href="index.html">首页</a></li> <li class="xl"><a href="shitai.html">食 • 态</a> <ul class="er"> <li><a href="shitai.html?1_1">将来食</a></li> <li><a href="shitai.html?1_1">将来食</a></li> <li><a href="shitai.html?1_1">将来食</a></li> </ul> </li> <li><a href="index.html">食•谱</a></li> <li><a href="index.html">食•聊</a></li> <li><a href="index.html">食•熟</a></li> <li><a href="index.html">食•熟</a></li> <li><a href="index.html">食•熟</a></li> </ul> <div class="login"><span><a href="">登录</a></span><span><a href="">注册</a></span></div> <div class="searchbtn"></div> </div> </div> </div> </div> </body> </html>