今天在cnbeta上看到一片作者評(píng)論div+css的文章，標(biāo)題為“DIV+CSS 請不要再出來忽悠人了！”，文章的大致內(nèi)容如下：
<blockquote>今天，盡管提到DIV+CSS，還會(huì)有很多人熱情高漲，但是我會(huì)對他搖頭了：DIV+CSS不是一切，更不是某些人所謂的“神話”！創(chuàng)造神話的是CSS，不是DIV+CSS。我想，是時(shí)候糾正這個(gè)問題了。
CSS的要義，是各個(gè)標(biāo)簽要各盡用，盲目推崇DIV+CSS只會(huì)讓小白誤入歧途的。
1、DIV只是HTML最常用的標(biāo)簽之一
顯然HTML并不只是一個(gè)DIV標(biāo)簽有用，每個(gè)標(biāo)簽都有它的用途，只是DIV是其中最有用的一個(gè)罷了。如果DIV可以實(shí)現(xiàn)所有其它標(biāo)簽的功能，那么W3C早就把HTML精簡了！
Table也不是一無是處，只是用table比較簡單、容易上手才在早期被人錯(cuò)誤的廣泛推廣。但是table在處理網(wǎng)頁數(shù)據(jù)的表現(xiàn)上，是其他標(biāo)簽無法替代的，只是，它不適合用來做整個(gè)頁面的布局。
2、代碼的可讀性
純DIV+CSS的網(wǎng)站的代碼的可讀性無疑是非常差的，甚至table還可以通過tr和td來區(qū)分行和列，一堆DIV堆砌在一起，如果沒有注釋，你根本不知道某個(gè)部分是做什么用的。
3、語義化與結(jié)構(gòu)化
現(xiàn)在，在開發(fā)CSS的時(shí)候，提的越來越多的是語義化，語義化歸根到底其實(shí)還是代碼的可讀性問題。語義化就是讓代碼更易讀，更加易懂，比如，.text_01{color:red} 就沒有.text_red{color:red} 容易理解。
HTML同樣如此，比如我們看到<ol>就知道這是個(gè)有序列表；看到<p>標(biāo)簽就知道這是一個(gè)段落，內(nèi)容為文字；看 到<span>就知道這個(gè)是比<p>還小的文字單位；看到<h1>、<h2>之類的就知道他們是標(biāo)題。
顯然，全部是div的頁面，是看不出來這些的。
頁面的結(jié)構(gòu)化亦是如此，比 如<div><div><div><div>…..</div>< /div></div></div>這樣的代碼，顯然是很難理解其DOM結(jié)構(gòu)的，但 是<div><p><h2><span>…..</span>< /h2></p></div>就比上面的那個(gè)結(jié)構(gòu)要清晰很多。
相信做開發(fā)的人對代碼的語義化和結(jié)構(gòu)化的理解會(huì)更加深刻。
4、團(tuán)隊(duì)合作
可讀性低、結(jié)構(gòu)化和語義化差，團(tuán)隊(duì)的其他成員的學(xué)習(xí)和維護(hù)難度就會(huì)提高，這對于一個(gè)團(tuán)隊(duì)來說，是很浪費(fèi)時(shí)間和精力的。
其實(shí)，DIV+CSS的說法，已經(jīng)把我們從table帶到了另外的一個(gè)極端，正確的網(wǎng)頁設(shè)計(jì)不是一個(gè)標(biāo)簽雄霸天下，而是每個(gè)元素都使用合適的標(biāo)簽。
所以說，DIV+CSS要換一種說法了，(X)HTML+CSS不更合適嗎？
請不要再特意提DIV了。小白們真的會(huì)把它當(dāng)作寶貝的！
其實(shí)回頭看看國內(nèi)普及標(biāo)準(zhǔn)化的過程，已然走錯(cuò)路了，就在國外同行研究CSS Sprites和網(wǎng)格（Grid）等技術(shù)時(shí)，我們在做什么？就在國外CSS框架遍地開花的時(shí)候，我們在做什么？到現(xiàn)在我們還是只能去國外的東西，依然跟在別人后面。</blockquote>
作者提到的“每個(gè)元素都使用合適的標(biāo)簽”這一點(diǎn)，還是非常正確的！但作者說div+css的學(xué)習(xí)和使用者是走錯(cuò)了路，走了極端，這點(diǎn)我個(gè)人認(rèn)為是有問題的，寫出這類代碼的人他應(yīng)該只是處于過度階段，對于xhtml的標(biāo)簽的特點(diǎn)和不是十分了解，以至于只能反復(fù)用到一些常用的標(biāo)簽，如作者提到的div標(biāo)簽，但隨著對xhtml標(biāo)簽的理解逐步加深，他們慢慢認(rèn)識(shí)到用合理的標(biāo)簽，不僅能讓代碼結(jié)構(gòu)簡化，而且還能是代碼易讀；
為了能讓正處在這一過度階段的朋友更好了解到xhtml標(biāo)簽，我簡單介紹下各標(biāo)簽：
Document Outline
<!DOCTYPE>Version of (X)HTML
<html>HTML document
<head>Page information
<body>Page contents
PageInfomation
<base />Base URL
<meta />Meta data
<title>Title
<link />Relevant resource
<style>Style resource
<script>Script resource
Document Structure
<h[1-6]>Heading
<div>Page section
<span>Inline section
<p>Paragraph
<br />Line break
<hr />Horizontal rule
Lists
<ol>Ordered list
<ul>Unordered list
<li>List item
<dl>Definition list
<dt>Definition term
<dd>Term description
Forms
<form>Form
<fieldset>Collection of fields
<legend>Form legend
<label>Input label
<input />Form input
<select>Drop-down box
<optgroup>Group of options
<option>Drop-down options
<textarea>Large text input
<button>Button
Text Markup
<strong>Strong emphasis
<em>Emphasis
<blockquote>Long quotation
<q>Short quotation
<abbr>Abbreviation
<acronym>Acronym
<address>Address
<pre>Pre-formatted text
<dfn>Definition
<code>Code
<cite>Citation
<del>Deleted text
<ins>Inserted text
<sub>Subscript
<sup>Superscript
<bdo>Text direction
Tables
<table>Table
<caption>Caption
<thead>Table header
<tbody>Table body
<tfoot>Table footer
<colgroup>Column group
<col />Column
<tr>Table row
<th>Header cell
<td>Table cell
Images and Image Maps
<img />Image
<map>Image Map
<area />Area of Image Map
Object
<object>Object
<param />Parameter
