讓你使用div+css排版 不是讓你用換個標籤然後再去按照**的方式去排版
而是做到內容與表現的分離
1: id用於標識頁面單獨元素以及持久行的結構性元素 方便js的呼叫
類用於標識同一頁面可重複定義使用的結構性元素 id與類的命名需與表現形式無關 ：leftcontent 而使用有意義的定義方式：sidebar等等。命名方式遵循「駝峰式大小寫（標誌符由多個單詞組成 除首詞首字母小寫外 其餘單詞首字母均大寫）」
2：避免濫用類 當型別的結構需要不一樣的表現時 記得什麼是層疊樣式表 具體結構中的p a h1等可使用如下方式：div.sidebar p{}定義即後代選擇器+id或類選擇器組合方式。
3：div與span div（塊級框）用於對塊級元素的分組 span（行內框）用於對行內元素分組標識
4：對於頁面基本預設的方式可以選擇通用選擇器（*標識）進行定義 *
5: body 也是可以新增id和類的 這樣就可以為其新增特別樣式。
6:樣式表中匯入樣式表需在頂端 覆蓋規則為本身樣式覆蓋匯入樣式
7：css樣式表細分化 顏色 布局 風格 表單 均可分離 這樣對以後的修改和風格設計更方便
8：盒模型：內→外
content←width height(補充：height只有在父元素定義了絕對高度時其%才有意義)
border
padding（內補丁）-「填充」
background-image
background-color
margin(外補丁)-「空白邊」透明 可為負值
記住:在css中 width是指內容區域的寬度
ie/win與盒模型：
ie5.5/ie6怪異模式下： 元素框總寬度=content.width+margin.width
firefox/opera/.. : 元素框總寬度=content.width+padding.width+border.width+margin.width
差異在於：ie5.5/ie6怪異模式下 width=有效content.width+padding.width+border.width 內補丁和邊框被算在內容寬度裡面
#select ie怪異模式:總寬度：750px ff/op：780px
ie怪異模式:有效內容寬度：750-20-10 ff/op：750
ie6正常模式下：同於ff/op
處理方法：在父元素或子元素中使用padding 本身不使用
空白邊疊加：當兩個空白邊疊加時 頂或底邊將會疊加 實際空白邊高度=空白邊大的值
例：空白邊高度為20px
但是如果這個時候你新增邊框或則填充，將不再疊加
//定位機制//
9：相對定位（relative）：相對於其預設初始位置 絕對定位：相對父級元素或畫布、html元素 與文件流無關 可覆蓋其他元素 使用z-index 控制其層次。ie5.5/ie6下 對right bottom時 需設定框的寬高 後則根據畫布右底定位
絕對定位（absolute）
10：float浮動：記住：「在標準瀏覽器中 浮動元素脫離了文件流 不佔據外圍容器空間」 明白了這點 你就會明白為什麼ie和firefox下表現的不同了。ie5.5、ie6浮動元素依然佔據外圍容器空間
例如：怎麼在ie下feeter正常 在firefox下就跑上去了呢？^_^ 清除浮動吧
ie下 當float和text-align定義的方向一樣時 出現雙倍錯誤：select
實際左邊margin-left：20px；ff/op：10px 解決：加上display：inline；
11：徹底理解 「清除浮動」clear
clear：none、left、right、both、
表示當前框元素哪些邊不應該挨著浮動框
理解了10中float在不同瀏覽器下的表現 你也就知道如何去使用清楚了。
12：背景影象的定位：只談百分比 background:url(image-url.gif)no-repeat 20% 30%
20%：將影象x軸20%處與父元素x軸20%處重合 y同理 top=0% bottom=100% left=0% right=100% center=50%
13：滑動門/
左右兩個div 背景分別定義 一般左背景影象比較長; 左背景定位：left center 右背景定位：right center
外部控制容器寬度一般小於等於兩個背景和 這樣當內容動態變化時候 右背景影象便感覺像在左背景影象上滑動，故名。
這樣也可以實現：
DIV CSS布局總結
float 內容不會覆蓋 1.f子塊內容脫離父塊，故父塊高度變小 2.f子塊左 右浮動，f子塊的寬度變小 a 父塊的padding left f塊的margin left 3.n子塊上移，且內容環繞f子塊，a n子塊邊框 背景色撐滿父塊，但內容不會和f塊重疊，而是環繞 b n子塊內容保持著f塊設定的...
Div Css乙個初體驗例子
眾所周知，網頁設計經歷了三個時期，table,table css,div css，現在主流的門戶 都是使用div css。同樣，div css能夠是網頁的 簡潔，並且對搜尋引擎更加友好。下面來演示乙個簡單的div css網頁 首先是網頁 12 3 456789 然後是css css是層疊樣式表，用於...
DIV CSS經驗總結
1 網頁居中顯示 需要設定兩個地方，乙個是body，乙個是外邊框div。css body main 2 文字垂直居中顯示 在div中定義乙個行高與其高度相同即可。css title 在4 清除浮動 如果在同一行上有幾個div並列顯示，那麼必須在其中加入清除浮動 如果在一行上只是乙個div，好象不必清...