標籤：返回頂部 http io os sp on div bs ad
relative和absolute的一丟丟。
position：relative ：元素框位移某個距離。元素仍保持其未定位前的形狀，它原本所佔的空間仍保留。
position：absolute ：元素框從文檔流完全刪除，並相對於其包含塊定位。包含塊可能是文檔中的另一個元素或者是初始包含塊。元素原先在正常文檔流中所佔的空間會關閉，就好像元素原來不存在一樣。元素定位後產生一個塊級框，而不論原來它在正常流中產生何種類型的框。
三個關鍵詞：位移位置、文檔流影響和佔據空間。
----------題圖demo分割線-----------------------------------我愛前端------------------------------------題圖demo分割線-----------------------------------我愛前端--------------------------------------------------------題圖demo分割線-----------------------------------我愛前端----
相對瀏覽器左上方body位移
position：relative 青色相對文本位移20px：
position：absolute 青色塊相對包含塊位移20px（位置將依據瀏覽器左上方的0點開始計算）：
相對父元素位移：
positon：relative 相對藍色塊位移20px，最近的元素移動位移；
postion：absolute相對藍色塊位移： 左邊為什麼不相對藍色塊定位位移呢？
張三李四說法：如果父級元素是沒有設定未聲明position：relative，那麼絕對位置（absolute）自動以body左上方定位。
這句話是只對了一半，返回頂部仔細閱讀absolute定義第二句話“包含塊”；
正確的是：父元素設了position值不是static，那麼子項目定位絕對位置即以此為包含塊。
絕對位置參照物是他的包含塊。
本文只對位移位置說明，文檔流和佔據空間不加說明。
ps：很多東西只看別人文章（道理），依舊寫不好code（過不好一生），必須自己running。
小tip：【css】position移動位置
