码迷,mamicode.com
首页 > 其他好文 > 详细

锚点定位

时间:2015-07-28 12:50:36      阅读:124      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<title>锚点定位</title>
<style type="text/css">
#thediv,#thediv2,#thediv3,#thediv4 {width:100%;height:50px;background:#CCC;margin-top:100px;}
.position{float: left;position: fixed;top: 10px;}
.position ul{list-style: none;}
.position ul li {float: left;padding: 10px;}
.position ul li a {text-decoration: none;background: #abcdef;}
</style>
</head>
<body style="height:1000px;">
<div class="position">
<ul>
<li><a href="#thediv">峰峰</a></li>
<li><a href="#thediv2">小吃货</a></li>
<li><a href="#thediv3">球球</a></li>
<li><a href="#thediv4">喋喋</a></li>
</ul>
</div>

<div id="thediv">峰峰</div>
<div id="thediv2">小吃货</div>
<div id="thediv3">球球</div>
<div id="thediv4">喋喋</div>
</body>
</html>

锚点定位

标签:

原文地址:http://www.cnblogs.com/-zhuli/p/4682372.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!