<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta "charset=utf-8" />
<title>网页定位导航</title>
<style>
body,ul,li,a,img,h1,h2{
margin:0;
padding:0;
}
body{
font-size:12px;
}
.content{
width:660px;
margin:0 auto;
padding:20px;
}
.content h1{
font-size:16px;
font-weight:bold;
margin-bottom:20px;
}
.content .item{
padding:20px;
border:1px dotted #09F;
margin-bottom:20px;
}
.content .item h2{
font-size:14px;
font-weight:bold;
border-bottom:2px solid #06F;
margin-bottom:20px;
}
.content .item li{
list-style:none;
display:inline;
margin:20px;
}
.content .item li a img{
width:109px;
height:80px;
border:none;
}
.menu{
position:fixed;
top:100px;
left:50%;
margin-left:330px;
}
.menu li{
list-style:none;
}
.menu li a{
display:block;
width:80px;
height:35px;
line-height:35px;
text-align:center;
text-decoration:none;
color:#000;
outline:none;
}
.menu li a:hover,
.menu li a.selected{
background-color:#06F;
color:#FFF;
}
</style>
</head>
<body>
<div class="menu">
<ul>
<li><a href="#item1" class="selected">1F 男装</a></li>
<li><a href="#item2">2F 女装</a></li>
<li><a href="#item3">3F 美妆</a></li>
<li><a href="#item4">4F 母婴</a></li>
<li><a href="#item5">5F 家居</a></li>
</ul>
</div>
<div class="content">
<h1>地狗购物</h1>
<div class="item" id="item1">
<h2>1F 男装</h2>
<ul>
<li><a href="#"><img src="1.gif" /></a></li>
...
</ul>
</div>
<div class="item" id="item2">
<h2>2F 女装</h2>
<ul>
<li><a href="#"><img src="2.gif" /></a></li>
...
</ul>
</div>
<div class="item" id="item3">
<h2>3F 美妆</h2>
<ul>
<li><a href="#"><img src="3.gif" /></a></li>
...
</ul>
</div>
<div class="item" id="item4">
<h2>4F 母婴</h2>
<ul>
<li><a href="#"><img src="4.gif" /></a></li>
...
</ul>
</div>
<div class="item" id="item5">
<h2>5F 家居</h2>
<ul>
<li><a href="#"><img src="5.gif" /></a></li>
...
</ul>
</div>
</div>
</body>
</html>
麻烦问下我加了锚链接之后前面三楼都正常出现在屏幕最上方,但是四五楼点了就没反应是什么情况呢?不往上走了