标签：固定导航 fixed position 侧栏固定 html5
固定侧边的做法有很多种，今天为大家介绍一种非常简单的做法。整个html文档只有23行代码就搞定了。
网上也有很多做法，但是都太过复杂，一大堆代码。而且有的很采用一些jquery的一些插件。
侧栏的做法和顶部、页脚都大致雷同。掌握其中的一种，其他的都很容易实现。常见的例子有：新浪微博的菜单栏，新浪体育的右侧二维码扫描等功能都是这样的实现。
这种固定特定部位，而不随滚动条滚动的做法，见下面代码：
<!DOCTYPE html>
<html>
<head>
<title>测试</title>
<style>
#left{
position:fixed;
top:100px;
right:0px;
}
.content{
height:1700px;
border:1px solid red;
}
</style>
</head><!-- 欢迎大家关注我的博客！如有疑问,请加QQ群：454796847共同学习！ -->
<body>
<div id="left">
<img src="1.png"/>
</div>
<div class="content"></div>
</body>
</html>运行效果如下：
欢迎大家关注我的博客！如有疑问,请加QQ群：454796847共同学习！ 版权声明：本文为博主原创文章，未经博主允许不得转载。
标签：固定导航 fixed position 侧栏固定 html5
原文地址：http://blog.csdn.net/xmtblog/article/details/46817099
