CSS+DIV布局已經(jīng)變成白菜一樣了，到處都是CSS+DIV布局，去面試一個做網(wǎng)頁的公司，肯定會問，你會CSS+DIV布局不。到底啥是CSS+DIV布局呢？傳統(tǒng)上都是以用TABLE布局的，TABLE布局的要點是有兩個，第一：適當(dāng)?shù)牡胤胶喜⑿泻土校诙憾甌ABLE嵌套Table。
而且還可以直接在頁面上控制Table的高度長度。TABLE布局最大的缺點，除了沉長的TR,TD之外，言論最多的就是SEO里對Table布局的鄙視。大部分SEO人都會覺得Table布局不利于SEO優(yōu)化。這點。。到真是有點關(guān)系，我試過兩個完全一樣的網(wǎng)站，一個是用Table布局的，我是用CSS+DIV布局的，并適當(dāng)?shù)氖褂昧薍標(biāo)記，在GOOGLE搜索上，我CSS+div布局的網(wǎng)站要比Table布局的要靠前。。。至于為什么，那個不是本文的重點。。忽略掉。

?? CSS+DIV布局最大的特點就是HTML文件里的代碼相對比較少，但是也造成了瀏覽器布局問題。。網(wǎng)上很多人都在說，我布局在IE里顯示正常，在FF下全部變形了。其實造成這樣問題的原因是你寫的CSS并不標(biāo)準(zhǔn)，可以說你寫的CSS都是根絕IE的標(biāo)準(zhǔn)來寫的，而不是CSS2.0的國際標(biāo)準(zhǔn)，無論是IE還是FF（3.0版前的我沒留意）都是支持CSS2.0的，但是在技術(shù)上，IE有寫模糊功能，可以令到非標(biāo)準(zhǔn)的CSS布局也能正確解析，一下是我寫CSS代碼的五個習(xí)慣，我不敢說我這五個習(xí)慣都是好習(xí)慣，至少我寫的CSS布局不會產(chǎn)生不良效果，也就是我寫的CSS有跨l瀏覽器能力。

第一：容器類DIV必須要有5個東西{margin，padding，width，height，overflow}，什么叫容器類，就是這個DIV只是用來放內(nèi)部的DIV的，也可以說是一個定位的div..例如：我們經(jīng)常使用居中，一般是這樣做的

第二：浮動對象，都擁有獨立的父DIV；關(guān)于這點。。有意見的人可能不少，持有的觀點就是，“你這樣做只會令DIV過分的多，過于復(fù)雜”，其實，我也不想這樣做，但是- -！IE對于浮動對象的{margin，padding}存在BUG所以為了減少一切可能的出錯，我唯有多花費一點代碼，說實在的我只是想它更健康。這個父DIV主要作用其實就是令到內(nèi)部浮動對象更可控制，這個父DIV就是一個單純的容器DIV

第三：所有的浮動都需要閉合；這個有經(jīng)驗的人都知道。。用完浮動你肯定需要把它閉合掉的，不閉合，可能不同瀏覽器在解析的時候會把你的浮動變成向下默認(rèn)，（可以這樣解析：就是元素內(nèi)部的子元素都默認(rèn)具有浮動屬性）

第四：一個行向浮動如果超過3個那么請使用UL來實現(xiàn)浮動

第五：靈活使用類選擇，我個人的做法是，所有的id選擇器都是用于布局的，類選擇器都是用于呈現(xiàn)效果的，這樣做的好處就是，當(dāng)你想要的效果出現(xiàn)問題的時候，更快速地找到錯誤。這個是我有意識的把“架構(gòu)”和“內(nèi)容”分離。

明鏡臺