1 ：css （cascading style sheet）：
初學(xué)者可以下載一本css 2.0 手冊(cè) 大概48小時(shí)的時(shí)間可以看完 試完。至于樣式手冊(cè)上的單詞（屬性和取值） 多久能背完取決你的努力和英語(yǔ)基礎(chǔ)，請(qǐng)注意 無(wú)論是div 還是css 還是html xhtml，其實(shí)如果你英文夠好做網(wǎng)頁(yè)和聊天沒(méi)有差別：
例1：
<style type="text/css">
.style1{width:500px; height:100px; float:left;}
</style>
你在告訴html 你制定了這樣的一個(gè)樣式 寬度500像素 高度100像素 左浮動(dòng)（如果你不理解什么是浮動(dòng)請(qǐng)相信成 左對(duì)齊）;
.style - 樣式名稱(chēng) 為什么使用大括號(hào)擴(kuò)起來(lái)呢？ 因?yàn)橐痪湓?句話說(shuō)不明白 括起來(lái)代表他屬于某一個(gè)集體；
冒號(hào)： 前面的教屬性 就像你自己 有身高 體重一樣！寫(xiě)樣式就像是介紹：
深海:{身高:170cm; 體重:60kg; }
2 div （division）：
div 的英文意思是區(qū)分，不加入樣式的情況下 它和p 標(biāo)記沒(méi)有什么大的區(qū)別。
3 div+css
給div 制定了樣式 他們的組合就演繹出了html 世界中強(qiáng)大的組合；
為什么使用div + css 有人說(shuō) 它實(shí)現(xiàn)了 內(nèi)容與展示形式的分離。如果你學(xué)明白了樣式你會(huì)拒絕這樣的說(shuō)法；
因?yàn)閠able+css 一樣可以！
有人說(shuō)div+css 天生優(yōu)化了搜索引擎，為何???
因?yàn)橥瑯邮遣季?div只需要一層結(jié)構(gòu) 而表格需要3層
例：
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>內(nèi)容</td>
</tr>
</table>
<div>內(nèi)容</div>
比較起來(lái)節(jié)省了 4行代碼 如果頁(yè)面上 出現(xiàn)N個(gè)table 那么可以節(jié)省 N*4 行代碼,我覺(jué)得這是DIV 唯一可以拿來(lái)炫耀一下的東西； 甚至我們也堅(jiān)信 內(nèi)層用p標(biāo)記也可以布局（不信你給p標(biāo)記加上樣式試試）
那么 我們要說(shuō) DIV+css 也沒(méi)什么 初學(xué)者千萬(wàn)別被他的無(wú)聊和重復(fù)嚇到
4 最大的呼聲??！ 不變形！?。。。。?/p>
網(wǎng)上有諸多的文章在說(shuō)div的變形 （在不同的瀏覽器下不同的效果）
初學(xué)的你是不是很怕火狐 很怕 ie 6？？？？
解決問(wèn)題的最簡(jiǎn)單辦法：
從哪里來(lái)回到哪里去?。。。。。。。。。。?！
不要用什么if 去判斷瀏覽器 這個(gè)世界上的瀏覽器種類(lèi)沒(méi)你想象的 遇到的那么少！?。?！
你要知道你來(lái)自table 請(qǐng)你回到table??！
不是叫你用table 是想 table 怎么布局的?。。?！ table 有什么重要的值 table 為什么要制定對(duì)齊方式！
div +css 永不變形規(guī)則：
1> 記住 3個(gè)值 寬度 高度 對(duì)齊方式 永遠(yuǎn)記?。?/p>
2> 頁(yè)面上出現(xiàn)變形 是因?yàn)槟銢](méi)有用div+css 布局?。。?/p>
你是否覺(jué)得我在開(kāi)玩笑？看看以下代碼
<div class="style1">
內(nèi)容1
</div>
<img src="xxx.jpg">
<div class="style2">
內(nèi)容2
</div>
我相信在頁(yè)面的某個(gè)部分你會(huì)出現(xiàn)類(lèi)型這樣的代碼 請(qǐng)注意你犯規(guī)了 你的布局方式叫 div+image+css
3> 只有矩形和矩形才能布局！??！
html 中所有外層結(jié)構(gòu)都是矩形 哪怕是圖片 圖上畫(huà)了 一個(gè)圓形 你可以打開(kāi)圖片看看 他是矩形！??！
想辦法把元素轉(zhuǎn)換成矩形并制定對(duì)齊方式 不能轉(zhuǎn)換成矩形的（文字）利用矩形包裹！ 然后布局 永不變形適用于各種瀏覽器?。?！
有哪些元素是矩形呢？
table p h1 - marquee embed center ...............................常見(jiàn)的html 標(biāo)記符都是矩形！！
誰(shuí)不是矩形呢？？？
文字！ 你是否有一種同感 文字和圖片布局都很難得到好的效果
誰(shuí)開(kāi)始不是矩形但是可以轉(zhuǎn)換成矩形呢？
a 鏈接本來(lái)是文字 當(dāng)你制定樣式為 display:block 的時(shí)候它就變成了矩形??！
****************************************************
4> 只要是矩形就有3個(gè)必須的屬性： 寬度 高度 對(duì)齊方式 請(qǐng)別忘記他們 只要你時(shí)刻記得 div+css 不變形的秘密你已經(jīng)掌握了 90%， 圖片 也有對(duì)齊方式哦?。?/p>
一定要掌握當(dāng) 對(duì)齊方式不同是 布局出現(xiàn)的問(wèn)題！
左右左 - 能不變形嗎？
默認(rèn) 是要換行的哦
div+css的 居中對(duì)齊 是有條件的哦（所有當(dāng)同級(jí)元素的對(duì)齊方式都為居中對(duì)齊的時(shí)候可以采用居中對(duì)齊）
5> 有些標(biāo)記是有默認(rèn)的間距的?。。。▋?nèi)間距 padding 外間距 margin）
body - 外間距
ul - ie下外間距 火狐下 內(nèi)間距
p - 內(nèi)間距
所以一旦使用他們要記得把他們先格式化！ 操作方法（內(nèi)間距 padding:0px; 外間距 margin:0px;）
6> 火狐下 當(dāng)高度為auto是 無(wú)法自適應(yīng) 解決辦法（overfollow:hidden）
7> 在還沒(méi)有完全掌握定位之前請(qǐng)放棄使用。本人堅(jiān)信 一般的html 不是用定位完全可以布局，因?yàn)閠albe 就沒(méi)有定位?。。。?！ 一樣可以布局很好 很穩(wěn)定。div 和 table 沒(méi)有實(shí)際區(qū)別 只是節(jié)省代碼?。?/p>
8> 再次強(qiáng)調(diào) 3個(gè)值 永遠(yuǎn)記住: 寬度 高度 對(duì)齊方式（永不變形的唯一秘訣）+ 只有矩形才有這樣的3個(gè)值！
div +css 的信心來(lái)源于多練 做的越多靜態(tài)越多 本人學(xué)習(xí)div 的總計(jì)時(shí)間是48小時(shí)。用的時(shí)間超過(guò)幾百小時(shí)。
現(xiàn)在有信心應(yīng)對(duì)所有的瀏覽器 如果想學(xué)好div 請(qǐng)現(xiàn)在起 打開(kāi)偉大的Dreamweaver 開(kāi)始你的旅程吧
祝你愉快！
