<!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>
麻烦问下我加了锚链接之后前面三楼都正常出现在屏幕最上方,但是四五楼点了就没反应是什么情况呢?不往上走了