既然都寫了一篇浮動布局，乾脆把定位（position）也寫了，這樣後端基本上能學會css布局了。我們所說的定位
position主要有三類：固定定位fixed，相對定位relative，絕對定位absolute。它們都有相同的四個屬性：top，bottom，left，right
主要在於他們的參照物不一樣
固定定位bottom: 40px;
right: 40px;
相對於瀏覽器視窗的絕對定位
top: 20px;
right: 20px;
相對定位
相對于父元素的絕對定位
right: 10px;
top: 20px;
相對定位
固定定位的參照物是瀏覽器視窗，很多視窗廣告就是用的固定定位，無論你怎麼滾動或者放大縮小視窗，永遠固定在瀏覽器視窗某個角落。
修改top，bottom，left，right的值可以調整元素在瀏覽器視窗的位置。
#div1
絕對定位的參照物是該元素上一級的擁有position:relative屬性的父元素，如果該元素的上一級父元素沒有設定相對定位，那麼該元素的參照物就會變成當前頁面。
修改top，bottom，left，right的值可以調整元素在父元素內的位置。
#div2
#div3
#div4
相對定位的參照物是該元素本來的位置。
修改top，bottom，left，right的值可以讓元素相對於原來的位置上下左右移動。
#div5
如何bug定位前端還是後端問題？
首先確認是的為測試環境或測試資料問題 其次基於經驗 如果是介面排版布局 相容性 文案展示問題很明顯就是前端問題。如果是網路不穩定下導致的前端檔案載入失敗，也是前端的問題。最後是資料或者處理邏輯上的問題 可以用瀏覽器自帶的f12或者檢視日誌分析。第一如果是瀏覽器自帶的f12，可以檢查請求的位址 引數和...
前端筆記 相對定位
定位 position 定位是一種更加高階的布局手段 通過定位可以將元素擺放到頁面的任意位置 使用position屬性來設定定位 可選值 static 預設值，元素是靜止的，沒有開啟定位 relative 開啟元素的相對定位 absolute 開啟元素的絕對定位 fixed 開啟元素的固定定位 st...
前端筆記 CSS定位
一 為什麼需要定位 某個元素可以自由的在乙個盒子內移動位置，並且壓住其他盒子。當滾動視窗時，某些模組是固定在螢幕中的某個位置。以上兩個效果通過標準流和浮動都無法快速實現，此時需要定位來實現。二 定位組成 定位 將盒子定在某一位置 定位 定位模式 邊偏移 定位模式用於指定元素在文件中的定位方式，邊偏移...