前面一篇部落格,我們提到了相對定位。除了相對定位,我們還有乙個絕對定位。下面分享我學習到的絕對定位。
絕對定位使用的是position: absolute;
定位需要乙個參照物:根據誰來做這個定位的?
查詢參照物順序:先找父級元素,如果有定位屬性(positon
)就以這個元素作為參照物發生偏移。如果沒有找到就向外層逐一查詢,直到找到positon
屬性的元素,如果一直都沒有,那麼就以最外層html元素作為參照物發生偏移。
**例項
只要複製下面的**,就可以看到絕對定位的效果。
前端CSS 相對定位,絕對定位,固定定位
position relative 必須先宣告,自己要相對定位了,left 100px 然後進行調整。top 150px 然後進行調整。相對定位不脫標,真實位置是在老家,只不過影子出去了,可以到處飄.position relative right 100px 往左邊移動 top 100px posi...
前端筆記 CSS定位
一 為什麼需要定位 某個元素可以自由的在乙個盒子內移動位置,並且壓住其他盒子。當滾動視窗時,某些模組是固定在螢幕中的某個位置。以上兩個效果通過標準流和浮動都無法快速實現,此時需要定位來實現。二 定位組成 定位 將盒子定在某一位置 定位 定位模式 邊偏移 定位模式用於指定元素在文件中的定位方式,邊偏移...
CSS 絕對定位
設定為絕對定位的元素框從文件流完全刪除,並相對於其包含塊定位,包含塊可能是文件中的另乙個元素或者是初始包含塊。元素原先在正常文件流中所佔的空間會關閉,就好像該元素原來不存在一樣。元素定位後生成乙個塊級框,而不論原來它在正常流中生成何種型別的框。絕對定位的元素的位置相對於最近的已定位祖先元素 如果元素...