固定定位- position: fixed
- 脱离文档流;
- 参照物是浏览器的可视窗口;任何元素都可以设置固定定位;
- 可设置top/ bot tom/left/ right四个方位
- 可通过z-index改变层级
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="text/css"> 7 /* 8 固定定位特点 9 1.会脱离文档流 10 2.可以设置上下左右四个方位 11 如果向时设置top和 bottom值只有top起作用 12 如果同时设置了1eft和riht值只有1eft起作用 13 3.参照物:整个浏览器窗口 14 4.可以设置z-index改变层级值越大越在上 15 */ 16 *{ 17 margin: 0; 18 padding: 0; 19 } 20 .header{ 21 width: 100%; 22 height: 100px; 23 background-color: #333; 24 position: fixed; 25 left: 0; 26 bottom: 0; 27 } 28 </style> 29 </head> 30 <body> 31 <div class="header"></div> 32 <div style="height: 2000px;"></div> 33 </body>