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相对于父元素。