這篇文章主要介紹了網頁布局有哪些方式，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。
網頁布局的三種方式分別是：1、標準文檔流；2、浮動；3、絕對定位。其中，絕對定位完全脫離了標準文檔流，建立了以包含塊為基準的定位，擁有偏移屬性和z-index屬性。
網頁布局的三種方式：
一：標準文檔流
1、從上到下 從左到右（塊級元素【div，ul，li，dl，dt，p】和行級元素【上盤，img，strong，input】）
2、盒子模型
1）盒子模型屬性：
邊框border ，
內邊距padding【（上，右，下，左）（上，左右，下）（上下，左右）】，外邊距margin【（上，右，下，左）（上，左右，下）（上下，左右）】。
3、盒子3d模型
1）盒子3d模型層級
1，border ；
2，content+padding；
3，background-img；
4，background-color；
5，margin；
4、盒子模型尺寸等于邊框+外邊距+內邊距+盒子中間內容尺寸
二：浮動 float
float：left，right，none
清除浮動：
1、clear：both；(一般用于緊鄰后面的元素清除浮動)
2、同時設置width：1000%（固定寬度）+overflow：hidden；
注：（當父包含快縮成一條時，用clear：both方法無效；一般用清除浮動的第二種方法）
三：絕對定位
1靜態定位 2相對定位 3絕對定位
感謝你能夠認真閱讀完這篇文章，希望小編分享的“網頁布局有哪些方式”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
