塊狀元素：
Div：塊級元素；dl和dt dd：搭配使用掌测；form：交互表單；
H1-h6：大標題成艘；hr：水平分割線赏半；ol：有序列表贺归；Ul：無序列表淆两；（ul和ol與 li連用）
p：段落標簽；fiedset：表單字段集拂酣；colgroup-col：表單列分組元素秋冰；
Table-tr-td：表格及行-單元格；pre：格式化文本婶熬；iframe：框架元素剑勾；
特征：
在沒有設置寬度的時候 默認撐滿一行
默認塊元素獨占一行
支持所有CSS命令

內聯(lián)（內嵌）元素：
表現(xiàn)形式始終以行內逐個顯示，沒有自己的形狀赵颅，不能定義寬高虽另，只能根據(jù)所包含內容來確定。
常用的：
Img：圖片饺谬； input：輸入框捂刺；
a：錨點；b：粗體（不推薦使用）募寨；br：換行族展；em：強調；
i：斜體拔鹰；span：內聯(lián)容器定義文本內區(qū)域仪缸；
label：表單標簽；strong：粗體強調列肢；textarea：多行文本輸入框恰画；
特征：
寬高由內容撐開
不支持寬高
一行上可以繼續(xù)顯示同類的標簽
不支持上下的margin
代碼換行被解析：
1宾茂、<span></span><span></span>
2、<span></span>
<span></span> 兩種情況不一樣 情況2效果會多一個空格

塊和內嵌（內聯(lián)）的轉換：
display：block 顯示為塊
使內聯(lián)元素具備塊屬性的特征

display：inline 顯示為內嵌
使行塊屬性標簽具備內聯(lián)元素的特性

display：inline-block
塊在一行顯示
內聯(lián)元素支持寬高
沒有寬度的時候 內容撐開寬度
標簽之間的換行間隙會被解析
（ie6 ie7不支持塊屬性標簽的inline-block）

float 浮動：
float:left/right/none/inherit; 向左浮動拴还、向右浮動刻炒、默認值無浮動、從父元素繼承float屬性的值（注意：這里的方向是按照子元素的先后順序）
注釋：任何的版本的 Internet Explorer （包括 IE8）都不支持屬性值 "inherit"自沧。
文檔流：文檔中可顯示對象在排列時所占用的位置
浮動：使元素脫離文檔流 按照指定方向發(fā)生移動 遇到父級邊界或者相鄰的浮動元素就停下來
浮動特征：
塊在一行顯示
內聯(lián)支持寬高
默認內容撐開高度
脫離文檔流
提升層級的半層
清除浮動的方法：
1坟奥、clear:left/right/both/none/inherit; 元素的左、右拇厢、兩邊爱谁、默認無、繼承方向上不能有浮動元素
2孝偎、加高 （問題：擴展性不好）
3访敌、給父級加浮動 （問題：頁面中所有的元素都加浮動 margin左右自動--auto失效）
4、inline-block （問題：導致margin左右auto失效）
5衣盾、空標簽 （問題：ie6最小高度19px;解決ie6下還有2px偏差）
6寺旺、.br清浮動---<br clear="all" /> （問題：不符合工作中結構、樣式势决、行為三者分離的要求）
重點掌握：
7阻塑、after偽類--- :after{content:""； display：block果复； clear：both陈莽；}（在父級上加after）

偽類：用于向某些選擇器添加特殊的效果
寫法：選擇器：偽類｛｝
a:link {color: #FF0000} /* 未訪問的鏈接 /
a:visited {color: #00FF00} / 已訪問的鏈接 /
a:hover {color: #FF00FF} / 鼠標移動到鏈接上 /
a:active {color: #0000FF} / 選定的鏈接 */
“選擇器:after”選擇器在被選元素的內容后面插入內容 必須使用 content 屬性來指定要插入的內容（after和content是組合）
p:after{ content:"臺詞"；}

position 定位：
position：relative虽抄；相對定位
不影響元素本身的特性
不使元素脫離文檔流（元素移動之后 原始位置會被保留）
**如果沒有定位偏移量 對元素本身沒有任何影響（僅有position：relative走搁； 沒有后續(xù)的left、top等指令）
提升層級
例如：

box_relative { （可以不寫_relative）

position: relative;
left: 30px;
top: 20px;
}

注意迈窟，在使用相對定位時私植，無論是否進行移動，元素仍然占據(jù)原來的空間车酣。因此曲稼，移動元素會導致它覆蓋其它框。

position：absolute骇径；絕對定位
使元素全脫離文檔流（原始位置不保留）
是內嵌支持寬高
快屬性標簽內容撐開寬度寬度
如果有定位父級則相對于定位父級發(fā)生偏移 沒有定位父級相對于document（可視區(qū)域 body本身有默認區(qū)域--margin）發(fā)生偏移
相對定位一般都是配合絕對定位元素使用
提升層級

position：fixed躯肌；固定定位
與絕對定位的特性基本一致 差別是始終相對整個文檔進行定位（問題：ie6不支持）
例如：
div{
position:fixed;
left:0;
bottom:0;
}

opacity 透明：
設置元素的不透明度級別
例如： div{opacity:0.5;}
規(guī)定不透明度：從 0.0 （完全透明）到 1.0（完全不透明）
如果出現(xiàn)在父級中 則影響子級

z-index：數(shù)字；定位層級
z-index 屬性設置元素的堆疊順序
擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面破衔。
可擁有負的 z-index 屬性值清女。
僅能在定位元素上奏效（例如 position:absolute;）

tableform 表格：
table 表格
thead 表格頭
tbody 表格主體
tr 表格行 （<tr></tr> 僅表示一行）
th 元素定義表頭
td 元素定義表格單元

**注意：text構成是一行一行完成的

設置單元格額外加：
table｛border-collapse:collapse;｝ 單元格間隙合并
th,td｛padding：0；｝重置單元格默認填加

colspan 規(guī)定單元格可整合的列數(shù)（但是并不減少其他的單元格數(shù)量）
<td colspan="數(shù)字"></td>
rowspan 規(guī)定單元格可整合的行數(shù)（但是并不減少其他的單元格數(shù)量）
<td rowspan="數(shù)字"></td>

form 表單：
<form action=""><input type=" " name=" " value=" " /></form>
text 文本框
password 密碼
radio 單選
checkbox 復選
submit 提交
reset 重置
button 按鈕
image 圖片
file 上傳
hidden 隱藏
例如：<form action=""><input type="text" name="user_name" value="輸入框" /></form>
單選：
<input type="radio" name="sex" value="man" />男
<input type="radio" name="sex" value="women" />女 （只有當單選的name是一樣的時候 才會出現(xiàn)互斥的現(xiàn)象 而復選則不會）
提交：
<form action="http://www.XXX.com">
<input type="submit" value="提交的按鈕名字"/> 提交到action后面的地址（如果不寫value 則默認值為“提交”）
按鈕：
<input type="button" value="自定義按鈕名字" /> 必須有value