absolute vs fixed 

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title>absolute和fixed的区别</title>
 5 <style type="text/css">
 6 body{color:#fff;}
 7 #html{ position:relative;width:778px; height:1000px; border:1px solid #0000FF;}
 8 #fixed,#absolute{width:200px; height:200px; background:#FF0000;}
 9 #fixed{position:fixed; top:50px; left:50px;}
10 #absolute{position:absolute; top:50px; left:450px;}
11 </style>
12 </head>
13 <body>
14 <div id="fixed">我在屏幕的位置不会改变</div>
15 <div id="html">
16 <div id="absolute">我会随屏幕滚动</div>
17 </div>
18 </body>
19 </html>

 

Fixed 相对于浏览器， Absolute相对于父元素。

posted @ 2014-01-13 03:27  daishuguang  阅读(194)  评论(0)  编辑  收藏  举报