<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>index</title>
<style type="text/css">
*{margin:0px;padding:0px;border:0px;color:#000000;font:normal 14px/100% Arial,宋体；}
.pw{border:1px solid #000000; width:960px; margin:0px auto;}
.clear{ clear:left; font-size:1px; width:1px; visibility:hidden}
/*header*/
#header{height:220px;background:url(images/logoright.jpg) right no-repeat;}
#header h1{float:left}
#header h2{float:right;margin:205px auto;}
#header h2 a{color:#00CC00; font-weight:bold; font-size:15px}
/*nav*/
#nav{height:35px; background:url(images/nav1.jpg); text-align:center;}
#nav ul{ float:left;list-style:none; margin:0px;}
#nav ul li{padding:0px 0px;display:inline;}
#nav ul li,#nav ul li a{ float:left; width:160px; height:35px; line-height:35px;}
#nav ul li a{ color:#333333; text-decoration:none; font-weight:bold; font-size:16px;display:inline-block;}
#nav ul li a:hover{ width:160px; height:35px; background:url(images/nav2.jpg)}
</style>
</head>
<body>
<div id="header" class="pw">
<h1><img src="images/logoleft.jpg" /></h1>
<h2><a href="#">加入收藏</a>|<a href="#">设为首页</a></h2>
</div>
<div class="clear"></div>
<div id="nav" class="pw">
<ul>
<li><a href="#">首       页 </a></li>
<li><a href="#">特色菜谱</a></li>
<li><a href="#">名店推荐</a></li>
<li><a href="#">厨房百科</a></li>
<li><a href="#">减肥良方</a></li>
<li><a href="mailto:1420616317@qq.com">联系站长</a></li>
</ul>
</div>
</body>
</html>
header h2{float:right;margin:205px auto;}
改成
header h2{float:right;margin:205px auto 0;}
可以用浏览器的调试工具检查一下，会发现是 header2 h2 那里的 margin 问题。浏览器的检查工具在做网页的时候还是很有用的。
不用框架是不符合潮流的
margin设置成负值。