【HTML】HTML基礎筆記02
二、HTML基礎（第二部分）
註：經常查閱文檔是一個很好的學習習慣！
1、表格 table(會使用)
存在即是合理的。 表格的現在還是較為常用的一種標簽，但不是用來布局，常見處理、顯示表格式數據。
創建表格
tr是“table row（表格行）”的縮寫，用於表示一行的開始和結束。
td是“table data（表格數據）”的縮寫，用於表示行中各個單元格（cell）的開始和結束。這些都是容
表格裏面沒有列的標簽
創建表格的基本語法如下：
<table> <tr> <td>單元格內的文字</td> ... </tr> ... </table>
註意：
創建表格的三個基本元素
1.table用於定義一個表格。
2.tr 用於定義表格中的一行，必須嵌套在 table標簽中，在 table中包含幾對 tr，就有幾行表格。
3.td /td：用於定義表格中的單元格，必須嵌套在<tr></tr>標簽中，一對 <tr> </tr>中包含幾對<td></td>，就表示該行中有多少列（或多少個單元格）。
關於嵌套問題
1. <tr></tr>中只能嵌套<td></td>
2. <td></td>標簽，他就像一個容器，可以容納所有的元素
表格屬性
三參為0 ，即是：border cellpadding cellspacing 為 0。
表頭標簽
表頭單元格一般位於表格的第一行或第一列，其文本加粗居中，如下圖所示，即為設置了表頭的表格。設置表頭非常簡單，
只需用表頭標簽th</th替代相應的單元格標簽td</td即可。
表的結構（了解）
在使用表格進行布局時，可以將表格劃分為頭部、主體和頁腳（頁腳因為有兼容性問題，我們不在贅述），具體 如下所示：
<thead></thead>：用於定義表格的頭部。
必須位於<table></table> 標簽中，一般包含網頁的logo和導航等頭部信息。
<tbody></tbody>：用於定義表格的主體。
位於<table></table>標簽中，一般包含網頁中除頭部和底部之外的其他內容。
表格的標題
表格的標題： caption
定義和用法
caption 元素定義表格標題。
<table> <caption>我是表格標題</caption> </table>
caption 標簽必須緊隨 table 標簽之後。
只存在 表格裏面
您只能對每個表格定義一個標題。通常這個標題會被居中於表格之上。
合並單元格（難點）
跨行合並：rowspan 跨列合並：colspan
合並單元格的思想：
? 將多個內容合並的時候，就會有多余的東西，把它刪除。 例如 把 3個 td 合並成一個， 那就多余了2個，需要刪除。
? 公式： 刪除的個數 = 合並的個數 - 1
合並的順序 先上 後下 先左 後右
- 先確定是跨行還是跨列合並
- 根據 先上 後下 先左 後右的原則找到目標單元格
- 刪除單元格 刪除的個數 = 合並的個數 - 1
總結表格
- 表格提供了HTML 中定義表格式數據的方法。
- 表格中由行中的單元格組成。
- 表格中沒有列元素，列的個數取決於行的單元格個數。
- 表格不要糾結於外觀，那是CSS 的作用。
2、表單標簽
現實中的表單，類似我們去銀行辦理信用卡填寫的單子。 如下圖
表單目的是為了收集用戶信息。
在我們網頁中， 我們也需要跟用戶進行交互，收集用戶資料，此時也需要表單。
在HTML中，一個完整的表單通常由表單控件（也稱為表單元素）、提示信息和表單域3個部分構成。
表單控件：
包含了具體的表單功能項，如單行文本輸入框、密碼輸入框、復選框、提交按鈕、重置按鈕等。
提示信息：
? 一個表單中通常還需要包含一些說明性的文字，提示用戶進行填寫和操作。
表單域：
? 他相當於一個容器，用來容納所有的表單控件和提示信息，可以通過他定義處理表單數據所用程序的url地址，以及數據提交到服務器的方法。如果不定義表單域，表單中的數據就無法傳送到後臺服務器。
input 控件(重點)
input 輸入的意思
在上面的語法中，input /標簽為單標簽，type屬性為其最基本的屬性 類型 ，其取值有多種，用於指定不同的控件類型。除了type屬性之外，input /標簽還可以定義很多其他的屬性，其常用屬性如下表所示。
type 說明了屬於那種表單，radio 如果是一組，我們必須給他們命名相同的名字 name 這樣就可以多個選其中的一個啦
label標簽(理解)
label 標簽為 input 元素定義標註（標簽）。
table
作用： 用於綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點
如何綁定元素呢？
for 屬性規定 label 與哪個表單元素綁定。
<label for="male">Male</label> <input type="radio" name="sex" id="male" value="male">
小技巧：英文全角狀態輸入法下，輸入一個空格相當於一個漢字的寬度！
【HTML】HTML基礎筆記02