挑戰百日學習計劃(南寧小程序開發)第22天(position定位)

要學小程序 前端是一個必須要跨過的坎,【南寧小程序開發:www.zkelm.com】

position 定位
position定位分5個:
1.static (默認的文檔流)
:由瀏覽器決定的,默認的排版模式 也是初始化的排版模式
2.relative sbsolute fixed

relative absolute fixed 三個屬性值都有一個一個共同點,就是相當於某個基點的定位, 不同的是在於基點的不同、所以 只要理解他們的基點是什麼。就很容易掌握這三個屬性值

這三種定位都不會對其他元素的位置產生影響。因此元素之間可能產生重疊

relative:相對定位

relative 表示,相對於默認位置(即 static時的位置) 進行偏移,即定位基點是元素的默認位置
搭配:left top right bottom 進行便宜定位

absolute:絕對定位

absolute表示:相對於上級元素,(一般是父元素)進行偏移,定位基點是父元素。{但是有一個前提,此父元素必須不能是 static定位,否定位的基點就會變成html的根元素} 同時定位也要搭配 :top left right bottom 四個屬性進行使用

fixed:固定定位

fixed 相對的基點是html的原點,也就是瀏覽器的窗口作爲相對基點

這樣導致,元素的位置不隨頁面滾動而變化,就好像固定在網頁一樣

下一章在補充一些具體得實例做練習

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章