在css中，有三種布局模型，分別為：流動模型，浮動模型，層模型。
1. 流動模型（flow）
流動模型為網頁預設的布局模式。
其中兩個比較典型的特徵：
a. 塊狀元素都佔滿一行，垂直分布下來，寬度預設都為100%。
b. 行內元素從左向右水平分布。
2. 浮動模型（float）
可為元素定義浮動模型：
float: left; //向左浮動 float: right; //向右浮動3. 層模型（layer）
層模型有三種形式：
a. 絕對定位（position: absolute）
b. 相對定位（position: relative）
c. 固定定位（position: fixed）
其中，關於絕對定位跟相對定位的配合使用（博主一開始學習到這個點的時候很是懵逼啊~）
如果元素的父元素等沒有相應相對定位設定，則元素會相對於html絕對定位，當將元素的父元素設定了相對定位之後，對元素設定絕對定位後，該元素的絕對定位將相對於此父元素。（即相對於最近的父元素）
其中該子元素的絕對定位，可通過設定top, bottom, left, right進行相應的設定。
如：
子元素
#father
#child
而關於固定定位，則通常用來將元素設定成不隨滾動條滾動的效果。
CSS 布局模型
一.流動模型 flow 1.首先它是網頁預設的布局方式，有兩個基本的特徵 i.塊狀元素都會在所處的包含元素內自上而下按順序垂直延伸分布，因為在預設狀態下，塊狀元素的寬度都為100 實際上，塊狀元素都會以行的形式佔據位置。如右側 編輯器中三個塊狀元素標籤 div，h1，p 寬度顯示為100 ii.在流...
CSS布局模型
css包含3種基本的布局模型，用英文概括為 flow layer 和 float。在網頁中，元素有三種布局模型 1 流動模型 flow 2 浮動模型 float 3 層模型 layer 1.流動模型 流動 flow 是預設的網頁布局模式。也就是說網頁在預設狀態下的 html 網頁元素都是根據流動模型...
css布局模型
清楚了css 盒模型的基本概念 盒模型型別，我們就可以深入 網頁布局的基本模型了。布局模型與盒模型一樣都是 css 最基本 最核心的概念。但布局模型是建立在盒模型基礎之上，又不同於我們常說的 css 布局樣式或 css 布局模板。如果說布局模型是本，那麼 css 布局模板就是末了，是外在的表現形式。...