固定定位
阿新 • • 發佈:2019-01-01
當元素的position屬性設定fixed時,則開啟了元素的固定定位
固定定位也是一種絕對定位,它的大部分特點都和絕對定位一樣
不同的是:
固定定位永遠都會相對於瀏覽器視窗進行定位
固定定位會固定在瀏覽器視窗某個位置,不會隨滾動條滾動
IE6不支援固定定位
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>固定定位</title> <style type="text/css"> .box1{ width: 200px; height: 200px; background-color: red; } .box2{ width: 200px; height: 200px; background-color: yellow; position: fixed; left: 0px; top: 0px; } .box3{ width: 200px; height: 200px; background-color: yellowgreen; } </style> </head> <body style="height: 5000px;"> <div class="box1"></div> <div class="box4" style="width: 300px; height: 300px; background-color: orange; position: relative;"> <div class="box2"></div> </div> <div class="box3"></div> </body> </html>