前端知識小結-CSS定位（position）的分類及用法
阿新 • • 發佈：2018-12-26
在複習的過程中總結了一些知識點，在以後會陸續分享給大家，有不對的地方也請大家指正！！！
CSS定位分類及用法
1.預設定位
position:static
在不寫的情況下預設為預設定位
2.絕對定位
position:absoluted
相對於最近的父元素定位，定位後空間釋放
3.相對定位
position:relative
相對於自己定位，定位後空間不釋放
4.固定定位
position:fixed
相對於瀏覽器定位，定位後空間釋放
5.吸頂定位
position:sticky
空間釋放
以下附上吸頂定位程式碼測試：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0px; padding: 0px; } body { height: 2000px; background: #63a35c; } #div1{ position: sticky; left: 100px; top: 0px; background: red; width: 200px; } </style> </head> <body> adqwdqdqdq <div id="div1"> dgasgasfas </div> </body> </html>
歡迎大家提出各種意見，定位是我們在css學習中很重要的一部分知識，在專案中會經常用到，在找工作面試時也是考官經常問的問題，希望本文對大家的學習有所幫助！！！