relative布局html,CSS的四种布局方式static/relative/fixed/absolute
生活随笔
收集整理的這篇文章主要介紹了
relative布局html,CSS的四种布局方式static/relative/fixed/absolute
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
static
static布局是HTML元素默認的布局方式,并且static布局的元素不會受到top/left/bottom/right屬性的影響。布局元素的位置即其在標準文檔流中的位置。
relative
相對布局是相對其在標準文檔流中的位置而言的。設置其top/left/bottom/right屬性會使該元素脫離標準文檔流,但是其在標準文檔流中的位置依然被保留,不會被其他元素填補。
fixed
fixed布局是相對于屏幕視點進行定位的,意味著即使拖動頁面滾動軸移動時,采用該布局的元素相對屏幕的位置不發生改變。
fixed布局可以使用top/left/bottom/right進行定位,采用fixed布局的元素完全脫離了標準文檔流,其原來在標準文檔流中的位置會被其他元素占據;
absolute
絕對定位元素是相對于其最鄰近的已定位的祖先元素進行定位的。如果一個絕對定位的元素沒有已定位的祖先元素,則使用document body作為已定位元素。這里所說的“已定位元素”指的是采用除了static以外的布局方式父元素,包括采用absolute定位的父元素。
總結
以上是生活随笔為你收集整理的relative布局html,CSS的四种布局方式static/relative/fixed/absolute的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: html模块殃射,【Web前端问题】we
- 下一篇: css 关闭按钮实现,CSS做的关闭按钮