接上文https://blog.csdn.net/IDtangjiasanshao/article/details/102964855
html新手前端筆記 知識點
表單標籤及屬性補充
表單字段集
語法：<fieldset disabled="disabled"></fieldset>
說明：相當於一個方框，在字段集中可以包含文本和其他元素。該元素用於對錶單中的元素進行分組並在文檔中區別標出文本。fieldset元素可以嵌套，在其內部可以在設置多個fieldset對象。disabled定義空間禁制可用；
1.2 字段級標題
語法：<legend align="left/center/right"></legend>
說明：legend元素可以在fieldset對象繪製的方框內插入一個標題。legend元素必須是fieldset內的唯一個元素。
1.3 提示信息標籤
語法：<label for="綁定控件id名"></label>
說明：label元素用來定義標籤，爲頁面上的其他元素指定提示信息。要將label元素綁定到其他的控件上，可以將label元素的for屬性設置爲與該控件的id屬性值相同。
1.4 上傳文本框
語法：<input type="file" multiple="multiple" /> 說明：type屬性值新增的類型有：file 文件類型，可進行文件的選擇，multiple 屬性可實現多選
1.5 圖像域
語法：<input type="image" src="" width="" height="" alt="圖片" /> 說明：火狐低版本不支持此表單元素;
2. 表格標籤及屬性補充
回顧： 表格的作用：顯示數據;
表格的基本結構：
<table>
<tr>
<td></td>
</tr>
</table>
2.1 單元格間距 border-spacing
語法：border-spacing:value;
說明：單元格間距(該屬性必須給table添加) 表示單元格邊框之間的距離， 不可取負值
2.2 合併相鄰單元格邊框 border-collapse
語法：border-collapse:separate/collapse;
說明：合併相鄰單元格邊框 (該屬性必須給table添加) separate(邊框分開)默認值； collapse(邊框合併)
2.3 無內容 empty-cells
語法：empty-cells:show/hide;
說明：定義當單元格無內容時，是否顯示該單元格的邊框區域；show：顯示 ；hide：隱藏；
2.4 定義表格佈局 table-layout
語法：table-layout:auto/fixed;
定義表格的佈局算法，設置fixed，文本爲英文字母且無空格時，內容超出單元格寬度則固定不變；如沒設寬則平均分配；設置auto時，則隨內容寬度而定；火狐瀏覽器存在兼容。 (fixed：固定寬，不會隨內容多少改變單元格寬,寬度可以明確定義，沒有定義時則寬度會平均分配，高度則會隨內容變化)
2.5 隔行變色
雙數行： tr:nth-child(2n){ } even
(偶數) 單數行：tr:nth-child(2n+1){ } odd
奇數 設置單數單元格的樣式和雙數單元格的樣式
2.6 表格標題
標題內容 caption:表格標題 表格標題位置：caption-side:top/right/bottom/left 說明：left,right位置只有火狐識別，top,bottom IE7上版本支持，ie7以下版本不支持其它屬性值，只識別top2.7 HTML 重要屬性
1）colspan="value" 合併列
2）rowspan="value" 和並行
3）valign="top/bottom/middle/baseline" 垂直對齊方式
4）rules="rows/cols/all/none" 添加組分隔線
說明：
rows:位於行之間的線條
cols:位於列之間的線條
all：位於行和列之間的線條
none:沒有線條
2.8 數據列分組
<colgroup span="value"></colgroup>
<col span="value" />
說明：
1）col和colgroup元素會根據從左到右的順序依次對數據表格進行分組。
2）span屬性顯示指定相鄰幾列組成一組，span屬性值默認爲1，默認時僅定義一列爲一組。
3）可以通過給table添加rules="groups"屬性來給分組列添加組的分割線。
注意：雖然col和colgroup具有相同的功能，一個是單標籤一個是雙標籤，兩個都存在瀏覽器兼容問題。
2.9 數據行分組
<thead></thead> 表頭
<tbody></tbody> 表體
<tfoot></tfoot> 表尾
說明：一個Table中，只能包含一個thead,一個tfoot,但可包含多個tbody。
thead 元素應該與 tbody 和 tfoot 元素結合起來使用。 tbody 元素用於對 HTML 表格中的主體內容進行分組， tfoot 元素用於對 HTML 表格中的表注（頁腳）內容進行分組。
如果要使用 thead、tfoot 以及 tbody 元素，就必須使用全部的元素。 它們的出現次序是：thead、tbody/tfoot、，這樣瀏覽器就可以在收到所有數據前呈現頁腳了。必須在 table 元素內部使用這些標籤。 提示：在默認情況下這些元素不會影響到表格的佈局。不過，可以使用 CSS 使這些元素改變表格的外觀。
詳細描述： thead、tfoot 以及 tbody 元素使我們有能力對錶格中的行進行分組。當創建某個表格時，也許希望擁有一個標題行，一些帶有數據的行，以及位於底部的一個總計行。這種劃分使瀏覽器有能力支持獨立於表格標題和頁腳的表格正文滾動。當長的表格被打印時，表格的表頭和頁腳可被打印在包含表格數據的每張頁面上
2.6 表格標題
標題內容 capt ion:表格標題 表格標題位置：caption-side:top/right/bottom/left 說明：left,right位置只有火狐識別，top,bottom IE7上版本支持，ie7以下版本不支持其它屬性值，只識別top2.7 HTML 重要屬性
1）colspan="value" 合併列
2）rowspan="value" 和並行
3）valign="top/bottom/middle/baseline" 垂直對齊方式
4）rules="rows/cols/all/none" 添加組分隔線
說明：
rows:位於行之間的線條
cols:位於列之間的線條
all：位於行和列之間的線條
none:沒有線條
2.8 數據列分組
(1)
(2)
說明：
1）col和colgroup元素會根據從左到右的順序依次對數據表格進行分組。
2）span屬性顯示指定相鄰幾列組成一組，span屬性值默認爲1，默認時僅定義一列爲一組。
3）可以通過給table添加rules="groups"屬性來給分組列添加組的分割線。
注意：雖然col和colgroup具有相同的功能，一個是單標籤一個是雙標籤，兩個都存在瀏覽器兼容問題。
2.9 數據行分組
```css
<thead></thead> 表頭
<tbody></tbody> 表體
<tfoot></tfoot> 表尾
說明：一個Table中，只能包含一個thead,一個tfoot,但可包含多個tbody。
thead 元素應該與 tbody 和 tfoot 元素結合起來使用。 tbody 元素用於對 HTML 表格中的主體內容進行分組， tfoot 元素用於對 HTML 表格中的表注（頁腳）內容進行分組。
如果要使用 thead、tfoot 以及 tbody 元素，就必須使用全部的元素。 它們的出現次序是：thead、tbody/tfoot、，這樣瀏覽器就可以在收到所有數據前呈現頁腳了。必須在 table 元素內部使用這些標籤。 提示：在默認情況下這些元素不會影響到表格的佈局。不過，可以使用 CSS 使這些元素改變表格的外觀。
詳細描述： thead、tfoot 以及 tbody 元素使我們有能力對錶格中的行進行分組。當創建某個表格時，也許希望擁有一個標題行，一些帶有數據的行，以及位於底部的一個總計行。這種劃分使瀏覽器有能力支持獨立於表格標題和頁腳的表格正文滾動。當長的表格被打印時，表格的表頭和頁腳可被打印在包含表格數據的每張頁面上。