[編輯本段]什么是DIV+CSS 網(wǎng)頁(yè)重構(gòu)
　　DIV+CSS是網(wǎng)站標(biāo)準(zhǔn)（或稱“WEB標(biāo)準(zhǔn)”）中常用術(shù)語之一，通常為了說明與HTML網(wǎng)頁(yè)設(shè)計(jì)語言中的表格（table）定位方式的區(qū)別，因?yàn)閄HTML網(wǎng)站設(shè)計(jì)標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用DIV+CSS的方式實(shí)現(xiàn)各種定位。
　　CSS是英語Cascading Style Sheets（層疊樣式表單）的縮寫，它是一種用來表現(xiàn) HTML 或 XML 等文件式樣的計(jì)算機(jī)語言。
　　HTML語言自HTML4.01以來，不再發(fā)布新版本，原因就在于HTML語言正變得越來越復(fù)雜化、專用化。即標(biāo)記越來越多，甚至各個(gè)瀏覽器生產(chǎn)商也開發(fā)出只適合于其特定瀏覽器的HTML標(biāo)記，這顯然有礙于HTML網(wǎng)頁(yè)的兼容性。于是W3C組織進(jìn)而重新從SGML中獲取營(yíng)養(yǎng)，隨后，發(fā)布了XML，XML是一種比HTML更加嚴(yán)格的標(biāo)記語言，全稱是可擴(kuò)展標(biāo)記語言（EXtensible Markup Language ）。但是XML過于復(fù)雜，且當(dāng)前的大部分瀏覽器都不完全支持XML。于是XHTML這種語言就派上了用場(chǎng)，XHTML語言就是一種可以將HTML語言標(biāo)準(zhǔn)化，用XHTML語言重寫后的HTML頁(yè)面可以應(yīng)用許多XML應(yīng)用技術(shù)。使得網(wǎng)頁(yè)更加容易擴(kuò)展，適合自動(dòng)數(shù)據(jù)交換，并且更加規(guī)整。說了這么多，現(xiàn)在該說正題了——CSS。其實(shí)CSS單獨(dú)使用除了麻煩一點(diǎn)之外，我個(gè)人覺得并無明顯的優(yōu)于HTML的好處。而關(guān)鍵就在于其與腳本語言（如Javascript）及XML技術(shù)的融合，即CSS+Javascript+XML（實(shí)際上有一種更好的融合：XML+XSL+Javascript）——但XSL，即可擴(kuò)展樣式表語言相較于CSS過于復(fù)雜，不太容易上手。自從CSS出現(xiàn)之后，HTML終于擺脫了雜亂無章的惡夢(mèng)，開始將頁(yè)面內(nèi)容與樣式分離。說了這么多，其實(shí)，個(gè)中真諦，還得使用過后才知道，所以，現(xiàn)在就開始學(xué)習(xí)使用吧。
　　DIV元素是用來為HTML文檔內(nèi)大塊（block-level）的內(nèi)容提供結(jié)構(gòu)和背景的元素。DIV的起始標(biāo)簽和結(jié)束標(biāo)簽之間的所有內(nèi)容都是用來構(gòu)成這個(gè)塊的，其中所包含元素的特性由DIV標(biāo)簽的屬性來控制，或者是通過使用樣式表格式化這個(gè)塊來進(jìn)行控制。
　　在可以預(yù)計(jì)的將來，table的地位依然十分重要，于是，如google之流依然會(huì)生意興隆。但是div代表的是網(wǎng)絡(luò)世界發(fā)展的方向。它們一個(gè)簡(jiǎn)單，一個(gè)先進(jìn)，蘿卜白菜，您選什么都是有可取只處的．我們都很按您的要求認(rèn)真服務(wù)的！
　　div是html(超文本語言)中的一個(gè)元素,div+css 是一種網(wǎng)頁(yè)的布局方法,這一種網(wǎng)頁(yè)布局方法有別于傳統(tǒng)的table布局,真正地達(dá)到了w3c內(nèi)容與表現(xiàn)相分離.
　　div 是標(biāo)簽 css是層疊樣式表
　　DIV+CSS高級(jí)布局已逐漸流行，但面對(duì)所謂DIV+CSS布局的叫法讓人更為擔(dān)心，不要讓DIV成為Table的替代品，多層嵌套的DIV會(huì)嚴(yán)重影響代碼的可閱讀性，活用HTML為我們提供的標(biāo)簽吧。
　　什么時(shí)候應(yīng)該用DIV?
　　雖然在這方面沒有什么硬性的規(guī)定,但個(gè)人認(rèn)為DIV更適用于大體框架的定位.例如我們要定義一塊頭部的區(qū)域,一般會(huì)這樣定義一個(gè)DIV:
　　這里就是頭部框架里要寫的內(nèi)容
　　當(dāng)然,可以用class來定義,但一般來講如不是在同一頁(yè)面會(huì)重復(fù)的元素,用id能更好的區(qū)別開來.
　　查看如下定義代碼
　　<ul id="navbar">
　　<li id="articles">
　　Articles</li>
　　<li id="topics">
　　Topics</li>
　　<li id="about">
　　About</li>
　　<li id="contact">
　　Contact</li>
　　<li id="contribute">
　　Contribute</li>
　　<li id="feed">
　　Feed</li>
　　</ul>
　　<h1 id="masthead">
　　<a href="/">
　　<img src="/pix/alalogo.gif" alt="A LIST Apart: For People Who Make Websites" />
　　</h1>
　　No. 214
　　定義了最上面的導(dǎo)航(ul部分),左邊的大logo和那個(gè)圓圓的No.xxxx的標(biāo)記.
　　他沒有使用DIV來做頂部的框架,但卻很好的說明了這些代碼的用途,為什么?因?yàn)樗钣昧薍TML提供的標(biāo)簽,以及樣式名稱的定義
　　其它最常用的布局標(biāo)簽
　　h1
　　這個(gè)標(biāo)簽或許真正會(huì)去用的人很少,因?yàn)樗@示的字體真的是太"大"了,但我們是CSSer,有什么標(biāo)簽樣式不能改呢?而且它所能表達(dá)的意思就如同它原先的作用一樣明顯(大標(biāo)題)我想你已經(jīng)知道怎么去用它了 ^_^
　　ul
　　這個(gè)標(biāo)簽很多情況是用來定義導(dǎo)航部分的,當(dāng)然也可以用ol來代替,但導(dǎo)航連接沒有什么順序之分吧,所以還是用ul來的比較確切(去掉CSS后效果更明顯)
　　b
　中國(guó)文秘網(wǎng) 個(gè)人工作總結(jié) 半年工作總結(jié) 年終工作總結(jié) 財(cái)務(wù)工作總結(jié) 教師工作總結(jié) 教學(xué)工作總結(jié) 德育工作總結(jié) 學(xué)校工作總結(jié) 安全工作總結(jié) 團(tuán)委工作總結(jié) 黨員工作總結(jié) 企業(yè)工作總結(jié) 班主任工作總結(jié) 黨支部工作總結(jié) 晚會(huì)主持詞 開業(yè)開幕 慶典致辭 新春致詞 婚禮主持詞 節(jié)日致辭 晚會(huì)致辭 追悼悼詞 領(lǐng)導(dǎo)講話 慰問賀電 年度工作計(jì)劃 個(gè)人工作計(jì)劃 學(xué)校工作計(jì)劃 黨支部工作計(jì)劃 團(tuán)委工作計(jì)劃 班主任工作計(jì)劃 工作匯報(bào) 思想?yún)R報(bào) 匯報(bào)材料 心得體會(huì) 學(xué)習(xí)心得 培訓(xùn)心得 工作心得 個(gè)人鑒定 調(diào)研報(bào)告 述職報(bào)告 實(shí)習(xí)報(bào)告 政府報(bào)告 考察報(bào)告 述廉報(bào)告 競(jìng)聘演講 就職演講 愛國(guó)演講 比賽演講 先進(jìn)事跡 學(xué)習(xí)材料 考察材料 經(jīng)驗(yàn)材料 交流材料 個(gè)人事跡 事跡材料 申報(bào)材料 活動(dòng)策劃 工作方案 整改方案 實(shí)施方案 營(yíng)銷方案 規(guī)章制度 公司通知 法律法規(guī) 和諧社會(huì)　這個(gè)已經(jīng)不再推薦使用的標(biāo)簽,在布局上卻能帶來不少的方便(因?yàn)槎?,雖然我不是太贊成使用這個(gè)標(biāo)簽,但有些時(shí)候(比如細(xì)小地方的布局定義)還是不錯(cuò)的選擇
　　h2
　　h2使用最多的地方應(yīng)該不是布局上,而是副標(biāo)題,但有些地方需要定義欄目樣式的話,用這個(gè)標(biāo)簽比較合適,欄目?jī)?nèi)容就使用p
[編輯本段]DIV+CSS的優(yōu)勢(shì)何在？
　　1、符合W3C標(biāo)準(zhǔn)。微軟等公司均為W3C支持者。這一點(diǎn)是最重要的，因?yàn)檫@保證您的網(wǎng)站不會(huì)因?yàn)閷砭W(wǎng)絡(luò)應(yīng)用的升級(jí)而被淘汰。 2、支持瀏覽器的向后兼容，也就是無論未來的瀏覽器大戰(zhàn)，勝利的是IE7或者是火狐，您的網(wǎng)站都能很好的兼容。 3、搜索引擎更加友好。相對(duì)與傳統(tǒng)的table, 采用DIV+CSS技術(shù)的網(wǎng)頁(yè)，對(duì)于搜索引擎的收錄更加友好。 4、樣式的調(diào)整更加方便。內(nèi)容和樣式的分離，使頁(yè)面和樣式的調(diào)整變得更加方便。 現(xiàn)在YAHOO,MSN等國(guó)際門戶網(wǎng)站，網(wǎng)易，新浪等國(guó)內(nèi)門戶網(wǎng)站，和主流的WEB2.0網(wǎng)站，均采用DIV+CSS的框架模式，更加印證了DIV+CSS是大勢(shì)所趨。5、CSS的極大優(yōu)勢(shì)表現(xiàn)在簡(jiǎn)潔的代碼，對(duì)于一個(gè)大型網(wǎng)站來說，可以節(jié)省大量帶寬，而且眾所周知，搜索引擎喜歡清潔的代碼。6、表現(xiàn)和結(jié)構(gòu)分離，在團(tuán)隊(duì)開發(fā)中更容易分工合作而減少相互關(guān)聯(lián)性。
[編輯本段]CSS放入網(wǎng)頁(yè)的幾種方式
　　行內(nèi)套用
　　我們可以在HTML文件內(nèi)直接宣告樣式。
　　舉例來說，Thisisfontsize16.
　　以上的HTML文件在瀏覽器上會(huì)顯現(xiàn)為：Thisisfontsize16.
　　嵌入套用樣式可以嵌入于HTML文件中(通常是在<head>內(nèi))。
　　舉例來說，<head><styletype="text/css"><styletype="text/css">div{div{background-color:#FF0000;}</style></head><body>背景顏色是紅色</body>
　　以上的HTML會(huì)顯現(xiàn)出：背景顏色是紅色
　　外部連接套用在這種方式下，所有的CSS樣式宣告都是存在另外一個(gè)檔案中。
　　該檔案通常名稱為.css。
　　在HTML文件的<header>..</header>之中，我們將用以下的程式碼將這個(gè).css檔案連接進(jìn)入：
　　<linkrel=stylesheettype="text/css" href="external-stylesheet.css">
　　以上這一行會(huì)將在external-stylesheet.css這個(gè)檔案內(nèi)所宣告的樣式加入HTML文件內(nèi)。
　　匯入套用匯入套用外部的CSS樣式也可以被匯入進(jìn)HTML文件。
　　匯入的做法為利用@import這個(gè)指令。
　　@import的語法為：<STYLETYPE="text/css"><STYLETYPE="text/css"><</STYLE>@import">!--@importurl(http://www.divhome.com/#.mysite.com/style.css);@importurl(</STYLE>
　　@import指令最初的用意，是為了能夠針對(duì)不同的瀏覽器而運(yùn)用不同的樣式。不過，現(xiàn)在已經(jīng)沒有這個(gè)必要?，F(xiàn)在用@import的目的，最常是要加入多個(gè)CSS樣式。當(dāng)多個(gè)CSS樣式被@import的方式加入，而不同CSS樣式互相有沖突時(shí)，後被加入的CSS樣式有優(yōu)先的順位(詳情請(qǐng)見CSS串接)。
　　div css-其它最常用的布局標(biāo)簽
　　h1 這個(gè)標(biāo)簽或許真正會(huì)去用的人很少,因?yàn)樗@示的字體真的是太"大"了,但我們是CSSer,有什么標(biāo)簽樣式不能改呢?而且它所能表達(dá)的意思就如同它原先的作用一樣明顯(大標(biāo)題)我想你已經(jīng)知道怎么去用它了 ^_^ .　ul 這個(gè)標(biāo)簽很多情況是用來定義導(dǎo)航部分的,當(dāng)然也可以用ol來代替,但導(dǎo)航連接沒有什么順序之分吧,所以還是用ul來的比較確切(去掉CSS后效果更明顯) .　
　　b 這個(gè)已經(jīng)不再推薦使用的標(biāo)簽,在布局上卻能帶來不少的方便(因?yàn)槎?,雖然我不是太贊成使用這個(gè)標(biāo)簽,但有些時(shí)候(比如細(xì)小地方的布局定義)還是不錯(cuò)的選擇
　　h2 h2使用最多的地方應(yīng)該不是布局上,而是副標(biāo)題,但有些地方需要定義欄目樣式的話,用這個(gè)標(biāo)簽比較合適,欄目?jī)?nèi)容就使用p。
[編輯本段]CSS＋DIV網(wǎng)站設(shè)計(jì)的問題
思想宣傳 反腐倡廉 十七大 剖析材料 三農(nóng)問題 八榮八恥 先進(jìn)性教育 組織人事 技巧經(jīng)驗(yàn) 簡(jiǎn)歷求職 申請(qǐng)書 模版范例 節(jié)目游戲 書信日記 黨會(huì)發(fā)言 入黨申請(qǐng) 教育教學(xué) 企業(yè)文化 入團(tuán)申請(qǐng) 黨員相關(guān) 財(cái)經(jīng)金融 城建環(huán)保 黨政司法 經(jīng)濟(jì)工作 合同協(xié)議 禮儀規(guī)范 金子般的顏色 麥家小說風(fēng)聲 風(fēng)聲第四章 成都撞車案 工商局長(zhǎng)講話范文 長(zhǎng)城 國(guó)慶大閱兵 迎國(guó)慶60周年演講稿 迎國(guó)慶 演講稿 PHP 動(dòng)態(tài)網(wǎng)頁(yè)技術(shù) 演講稿 武林外傳 同?？蜅?/span> 演講稿范文 范文 動(dòng)漫 麗江 旅游圣地 去旅游吧 中國(guó)閱兵 　　盡管DIV+CSS具有一定的優(yōu)勢(shì)，不過現(xiàn)階段CSS+DIV網(wǎng)站建設(shè)存在的問題也比較明顯，主要表現(xiàn)在：
　　第一，對(duì)于CSS的高度依賴使得網(wǎng)頁(yè)設(shè)計(jì)變得比較復(fù)雜。相對(duì)于HTML4.0中的表格布局（table），CSS+DIV盡管不是高不可及，但至少要比表格定位復(fù)雜的多，即使對(duì)于網(wǎng)站設(shè)計(jì)高手也很容易出現(xiàn)問題，更不要說初學(xué)者了，這在一定程度上影響了XHTML網(wǎng)站設(shè)計(jì)語言的普及應(yīng)用。
　　第二，CSS文件異常將影響整個(gè)網(wǎng)站的正常瀏覽。CSS網(wǎng)站制作的設(shè)計(jì)元素通常放在幾個(gè)l外部文件中，這一個(gè)或幾個(gè)文件有可能相當(dāng)復(fù)雜，甚至比較龐大，如果CSS文件調(diào)用出現(xiàn)異常，那么整個(gè)網(wǎng)站將變得慘不忍睹。
　　第三，對(duì)于CSS網(wǎng)站設(shè)計(jì)的瀏覽器兼容性問題比較突出。基于HTML4.0的網(wǎng)頁(yè)設(shè)計(jì)在IE4.0之后的版本中幾乎不存在瀏覽器兼容性問題，但CSS+DIV設(shè)計(jì)的網(wǎng)站在IE瀏覽器里面正常顯示的頁(yè)面，到火狐瀏覽器（FireFox ）中卻可能面目全非（這也是為什么建議網(wǎng)絡(luò)營(yíng)銷人員使用火狐瀏覽器的原因所在 ）。CSS+DIV還有待于各個(gè)瀏覽器廠商的進(jìn)一步支持。
　　第四，CSS+DIV對(duì)搜索引擎優(yōu)化與否取決于網(wǎng)頁(yè)設(shè)計(jì)的專業(yè)水平而不是CSS+DIV本身。CSS+DIV網(wǎng)頁(yè)設(shè)計(jì)并不能保證網(wǎng)頁(yè)對(duì)搜索引擎的優(yōu)化，甚至不能保證一定比HTML網(wǎng)站有更簡(jiǎn)潔的代碼設(shè)計(jì)，何況搜索引擎對(duì)于網(wǎng)頁(yè)的收錄和排序顯然不是以是否采用表格和CSS定位來衡量，這就是為什么很多傳統(tǒng)表格布局制作的網(wǎng)站在搜索結(jié)果中的排序靠前，而很多使用CSS及web標(biāo)準(zhǔn)制作的網(wǎng)頁(yè)排名依然靠后的原因。因?yàn)閷?duì)于搜索引擎而言，網(wǎng)站結(jié)構(gòu)、內(nèi)容、相關(guān)網(wǎng)站鏈接等因素始終是網(wǎng)站優(yōu)化最重要的指標(biāo)。
[編輯本段]使用DIV+CSS布局網(wǎng)站的優(yōu)點(diǎn)和缺陷
　　隨著WEB2.0標(biāo)準(zhǔn)化設(shè)計(jì)理念的普及，國(guó)內(nèi)很多大型門戶網(wǎng)站已經(jīng)紛紛采用DIV+CSS制作方法，奮斗網(wǎng)絡(luò)也成為了CSS網(wǎng)頁(yè)布局技術(shù)學(xué)習(xí)的先鋒站點(diǎn)，從實(shí)際應(yīng)用情況來看，此種方法絕對(duì)好于表格制作頁(yè)面的方法。
　　如今大部分網(wǎng)站仍然采用表格嵌套內(nèi)容的方式來制作網(wǎng)站，雖然此方法對(duì)于我們來說比較熟悉、比較上手；但是，它卻阻礙了一種更好的、更有親和力的、更靈活的，而且功能更強(qiáng)大的網(wǎng)站設(shè)計(jì)方法——DIV+CSS。
　　CSS網(wǎng)頁(yè)布局的意義體現(xiàn)在如下方面：
　　一、使頁(yè)面載入得更快
　　由于將大部分頁(yè)面代碼寫在了CSS當(dāng)中，使得頁(yè)面體積容量變得更小。相對(duì)于表格嵌套的方式，DIV+CSS將頁(yè)面獨(dú)立成更多的區(qū)域，在打開頁(yè)面的時(shí)候，逐層加載。而不像表格嵌套那樣將整個(gè)頁(yè)面圈在一個(gè)大表格里，使得加載速度很慢。
　　二、降低流量費(fèi)用
　　頁(yè)面體積變小，瀏覽速度變快，這就使得對(duì)于某些控制主機(jī)流量的網(wǎng)站來說是最大的優(yōu)勢(shì)了。
　　三、修改設(shè)計(jì)時(shí)更有效率
　　由于使用了DIV+CSS制作方法，在修改頁(yè)面的時(shí)候更加容易省時(shí)。根據(jù)區(qū)域內(nèi)容標(biāo)記，到CSS里找到相應(yīng)的ID，使得修改頁(yè)面的時(shí)候更加方便，也不會(huì)破壞頁(yè)面其他部分的布局樣式。
　　四、保持視覺的一致性
　　DIV+CSS最重要的優(yōu)勢(shì)之一：保持視覺的一致性；以往表格嵌套的制作方法，會(huì)使得頁(yè)面與頁(yè)面，或者區(qū)域與區(qū)域之間的顯示效果會(huì)有偏差。而使用DIV+CSS的制作方法，將所有頁(yè)面，或所有區(qū)域統(tǒng)一用CSS文件控制，就避免了不同區(qū)域或不同頁(yè)面體現(xiàn)出的效果偏差。
　　五、更好地被搜索引擎收錄
　　由于將大部分的HTML代碼和內(nèi)容樣式寫入了CSS文件中，這就使得網(wǎng)頁(yè)中正文部分更為突出明顯，便于被搜索引擎采集收錄。
　　六、對(duì)瀏覽者和瀏覽器更具親和力
　　我們都知道網(wǎng)站做出來是給瀏覽者使用的，對(duì)瀏覽者和瀏覽器更具親和力，DIV+CSS在這方面更具優(yōu)勢(shì)。由于CSS富含豐富的樣式，使頁(yè)面更加靈活性，它可以根據(jù)不同的瀏覽器，而達(dá)到顯示效果的統(tǒng)一和不變形。
　　說了這么多CSS網(wǎng)頁(yè)布局的意義與優(yōu)點(diǎn)，同時(shí)也不能輕視CSS網(wǎng)頁(yè)布局的副作用：
　　一、DIV+CSS盡管不是高不可及，但至少要比表格定位復(fù)雜的多，即使對(duì)于網(wǎng)站設(shè)計(jì)高手也很容易出現(xiàn)問題，更不要說初學(xué)者了。
　　二、CSS網(wǎng)站制作的設(shè)計(jì)元素通常放在1個(gè)外部文件中，或幾個(gè)文件，有可能相當(dāng)復(fù)雜，甚至比較龐大，如果CSS文件調(diào)用出現(xiàn)異常，那么整個(gè)網(wǎng)站將變得慘不忍睹。
　　三、雖然說DIV+CSS解決了大部分瀏覽器兼容問題，但是也有在部分瀏覽器中使用出現(xiàn)異常，比如火狐瀏覽器，在IE中顯示正常的頁(yè)面，到了火狐瀏覽器中可能會(huì)面目全非。當(dāng)然這應(yīng)該是瀏覽器的問題，但是可以說在目前來看，DIV+CSS還沒有實(shí)現(xiàn)所有瀏覽器的統(tǒng)一兼容。
　　四、DIV+CSS對(duì)搜索引擎優(yōu)化與否,取決于網(wǎng)頁(yè)設(shè)計(jì)的專業(yè)水平,而不是DIV+CSS本身。DIV+CSS網(wǎng)頁(yè)設(shè)計(jì)并不能保證網(wǎng)頁(yè)對(duì)搜索引擎的優(yōu)化，甚至不能保證一定比HTML網(wǎng)站有更簡(jiǎn)潔的代碼設(shè)計(jì)，何況搜索引擎對(duì)于網(wǎng)頁(yè)的收錄和排序顯然不是以是否采用表格和CSS定位來衡量，這就是為什么很多傳統(tǒng)表格布局制作的網(wǎng)站在搜索結(jié)果中的排序靠前，而很多使用CSS及web標(biāo)準(zhǔn)制作的網(wǎng)頁(yè)排名依然靠后的原因。因?yàn)閷?duì)于搜索引擎而言，網(wǎng)站結(jié)構(gòu)、內(nèi)容、相關(guān)網(wǎng)站鏈接等因素始終是網(wǎng)站優(yōu)化最重要的指標(biāo)。
　　綜合以上討論的DIV+CSS優(yōu)勢(shì)和略勢(shì)，我認(rèn)為不可盲目跟風(fēng)，如何更有效、更合理的運(yùn)用WEB2.0設(shè)計(jì)標(biāo)準(zhǔn)，這需要很長(zhǎng)時(shí)間的學(xué)習(xí)和鍛煉。而如何將DIV+CSS運(yùn)用的更好，我覺得這需要通過不斷的實(shí)踐和體檢，積累豐富的設(shè)計(jì)經(jīng)驗(yàn)，才能很好的掌握這門技術(shù)。
[編輯本段]Div+CSS常見錯(cuò)誤總結(jié)
　　CSS＋DIV是網(wǎng)站標(biāo)準(zhǔn)（或稱“WEB標(biāo)準(zhǔn)”）中常用的術(shù)語之一，通常為了說明與HTML網(wǎng)頁(yè)設(shè)計(jì)語言中的表格（table）定位方式的區(qū)別，因?yàn)閄HTML網(wǎng)站設(shè)計(jì)標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用css+div的方式實(shí)現(xiàn)各種定位。應(yīng)用應(yīng)用DIV+CSS編碼時(shí)很容易犯一些錯(cuò)誤。本文列舉了一些常見的錯(cuò)誤：
　　1. 檢查HTML元素是否有拼寫錯(cuò)誤、是否忘記結(jié)束標(biāo)記
　　即使是老手也經(jīng)常會(huì)弄錯(cuò)div的嵌套關(guān)系?？梢杂胐reamweaver的驗(yàn)證功能檢查一下有無錯(cuò)誤。
　　2. 檢查CSS是否正確
　　檢查一下有無拼寫錯(cuò)誤、是否忘記結(jié)尾的 } 等。可以利用CleanCSS來檢查 CSS的拼寫錯(cuò)誤。CleanCSS本是為CSS減肥的工具，但也能檢查出拼寫錯(cuò)誤。
　　3. 確定錯(cuò)誤發(fā)生的位置
　　如果錯(cuò)誤影響了整體布局，則可以逐個(gè)刪除div塊，直到刪除某個(gè)div塊后顯示恢復(fù)正常，即可確定錯(cuò)誤發(fā)生的位置。
　　4. 利用border屬性確定出錯(cuò)元素的布局特性
　　使用float屬性布局一不小心就會(huì)出錯(cuò)。這時(shí)為元素添加border屬性確定元素邊界，錯(cuò)誤原因即水落石出。
　　5. float元素的父元素不能指定clear屬性
　　MacIE下如果對(duì)float的元素的父元素使用clear屬性，周圍的float元素布局就會(huì)混亂。這是MacIE的著名的bug，倘若不知道就會(huì)走彎路。
　　6. float元素務(wù)必指定width屬性
　　很多瀏覽器在顯示未指定width的float元素時(shí)會(huì)有bug。所以不管float元素的內(nèi)容如何，一定要為其指定width屬性。
　　另外指定元素時(shí)盡量使用em而不是px做單位。
　　7. float元素不能指定margin和padding等屬性
　　IE在顯示指定了margin和padding的float元素時(shí)有bug。因此不要對(duì)float元素指定margin和padding屬性(可以在float元素內(nèi)部嵌套一個(gè)div來設(shè)置margin和padding)。也可以使用hack方法為IE指定特別的值。
　　8. float元素的寬度之和要小于100%
　　如果float元素的寬度之和正好是100%，某些古老的瀏覽器將不能正常顯示。因此請(qǐng)保證寬度之和小于99%。
　　9. 是否重設(shè)了默認(rèn)的樣式?
　　某些屬性如margin、padding等，不同瀏覽器會(huì)有不同的解釋。因此最好在開發(fā)前首先將全體的margin、padding設(shè)置為0、列表樣式設(shè)置為none等。
　　10. 是否忘記了寫DTD?
　　如果無論怎樣調(diào)整不同瀏覽器顯示結(jié)果還是不一樣，那么可以檢查一下頁(yè)面開頭是不是忘了寫下面這行DTD：
　　<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">[1]

• css
• div