1 DIV CSS對頁面布局的優勢

采用DIV+CSS模式的網站具有以下優勢：
表現和內容相分離
代碼簡潔，提高頁面瀏覽速度
易于維護和改版
提高搜索引擎對網頁的索引效率

“無意義”的HTML元素div和span
HTML只是賦予內容的手段，大部分HTML標簽都有其意義（例如，標簽p創建段落，h1標簽創建標題等等）的，然而div和span標簽似乎沒有任何內容上的意義，聽起來就像一個泡沫做成的錘子一樣無用。但實際上，與CSS結合起來后，它們被用得十分廣泛。你所需要記住的是span和div是“無意義”的標簽。它們的存在純粹是應用樣式，所以當樣式表失效時它就沒有任何的作用

它們被用來組合成一大塊的HTML代碼并賦予一定的信息，大部分用類屬性class和標識屬性id與元素聯系起來。span和div的不同之處在于span是內聯的，用在一小塊的內聯HTML中。而div（division）元素是塊級的（簡單地說，它等同于其前后有斷行），用于組合一大塊的代碼，為HTML 文檔內大塊的內容提供結構和背景的元素，可以包含段落、標題、表格甚至其他部分，這使div便于建立不同集成的類。

div的起始標簽和結束標簽之間的所有內容都是用來構成這個塊的，其中所包含元素的特性由div標簽的屬性來控制，或者是通過使用樣式表格式化這個塊來進行控制。

dem.html

<!--這是一行字<br>
<h1>這是一行字</h1>
<b>這是一行字</b> <br>
<u>這是一行字</u> <br>
<div>這是一行字</div>
這是一行字<br>
-->
<style>
    div span {
        color:red;
        font-weight:bold;
    }
</style>
<div>這是一行字</div>
<div>這是一行字</div>
<div>這是一行字</div>
<span>這是一行字</span>
<span>這是一行字</span>
<span>這是一行字</span>
<br>
<div>
<span>名子</span>：高洛峰 <br>
<span>年齡</span>：28 <br>
<span>性別</span>：男 <br>
</div>