1.優(yōu)勢(shì)
表現(xiàn)和內(nèi)容相分離泊碑；代碼簡(jiǎn)潔你弦，提高頁(yè)面瀏覽速度；易于維護(hù)和改版呀非；提高搜索引擎對(duì)網(wǎng)頁(yè)的索引效率
<span>和<div>標(biāo)簽是沒(méi)有語(yǔ)義的骨稿，是應(yīng)用樣式，所以當(dāng)樣式表失效時(shí)它就沒(méi)有任何的作用
2.盒模型層次
第1層：盒子的邊框(border)
第2層：元素的內(nèi)容(content)、內(nèi)邊距(padding)
第3層：背景圖(background-image)
第4層：背景色(background-color)
第5層：盒子的外邊距(margin)
3.水平居中和垂直居中
水平居中
垂直居中：
http://www.reibang.com/p/733d90f5b1cc
4.定位
絕對(duì)定位：absolute 相對(duì)于最近的具有定位屬性的父包含塊坦冠，若沒(méi)有則對(duì)body
相對(duì)定位：relative 相對(duì)于以前的位置移動(dòng)（偏移前的位置保留不動(dòng)）
固定定位：相對(duì)于瀏覽器窗口
5.浮動(dòng)布局
文檔流：瀏覽器根據(jù)元素在html文檔中出現(xiàn)的順序形耗，從左向右，從上到下依次排列辙浑。
設(shè)置元素的浮動(dòng)激涤，該元素將脫離文檔流，向左或向右移動(dòng)直到它的外邊距碰到父元素的邊框或另一個(gè)浮動(dòng)元素的邊框?yàn)橹?br>
行內(nèi)元素：行內(nèi)元素的表現(xiàn)形式主要在于填充內(nèi)容判呕，它默認(rèn)是沒(méi)有上下外邊距的倦踢，只可以左右，不能設(shè)置寬和高
6.清除浮動(dòng)
浮動(dòng)溢出侠草，容器沒(méi)有包圍浮動(dòng)元素辱挥，clear 只對(duì)塊級(jí)元素有效，表示如果前一個(gè)元素存在左浮動(dòng)或右浮動(dòng)边涕，則換行晤碘。與浮動(dòng)框互不干擾，需要對(duì)該框應(yīng)用功蜓。
浮動(dòng)元素后使用一個(gè)空元素clear:both;
浮動(dòng)元素的容器添加overflow:hidden;或overflow:auto;可以清除浮動(dòng)园爷，另外在 IE6 中還需要觸發(fā) hasLayout ，例如為父元素設(shè)置容器寬高或設(shè)置 zoom:1式撼；
使用CSS的:after偽元素童社，給浮動(dòng)元素的容器添加一個(gè)clearfix的class，然后給這個(gè)class添加一個(gè):after偽元素實(shí)現(xiàn)元素末尾添加一個(gè)看不見(jiàn)的塊元素（Block element）清理浮動(dòng)著隆，兼容IE觸發(fā) hasLayout扰楼。
