網頁的三種布局
流動模型（flow)
flow:預設的網頁布局模型。
浮動模型（flow）
可以讓塊級元素顯示在一行，用到float:left/right;層模型（layer）
層模型有三種形式：
(a)position:absolute;
這種形式將元素從文件流中拖出，然後用left,right,top,bottom屬性相對於最接近的乙個具有定位屬性的父包含塊進行絕對定位，如果不存在，則相對於body即瀏覽器視窗
(b)positon:relative;
通過left,right,top,bottom屬性確定元素在正常的文件流中的偏移位置。相對定位首先按照static(float)方式產生乙個元素（並且元素像層一樣浮動），然後相對於以前的位置移動，移動前的位置不變（雖然div元素相對於以前的位置產生了偏移，但是元素以前的位置還是保留著）。
(c)position:fixed;
它的相對移動的座標是檢視（螢幕內網頁視窗），不會隨著瀏覽器視窗的滾動條而改變，不受文件流的影響background-attachment:fixed屬性相同。
另外，relative和absolute組合使用使被設定元素不想對於瀏覽器定義
id="box1">
id="box2">相對參照元素進行定位div>
div>
#box1
#box2
定位和布局。
一 基本概念 視覺格式化模型 css的一種機制，它規定了頁面中的多個盒子如何布局 視覺格式化模型是一套非常複雜的機制，包含錯綜複雜的css規範 本章的課程從實用的角度出發，僅學習在劃分頁面區域的時候需要的核心知識 由於劃分頁面區域時幾乎都使用的是塊盒，因此，本章仍然只涉及塊盒 視口 一種視覺化的視窗...
定位和布局
定位和布局 1 1 視覺格式化模型 1 2 視口 1 2 包含塊 2 1 定位體系概述 常規流 normal flow 浮動 float 絕對定位 absolute positioned 2 2 定位體系判定 position 絕對定位為預設值static float 浮動預設值為 none 預設情...
css 布局和定位
首先，我們說一下flow，實際上就是從html在上面開始，從上到下沿著元素流逐個顯示。對於塊元素，從上到下布局。對於塊元素中的內聯元素，從左上方流向右下方。對於內聯元素我們需要注意間距問題 1.對於併排放置的兩個內聯元素，中間外邊距不會重疊。所以最終兩個元素中間相差兩個外邊距之和。2.對於上下放置的...