表格table
? * 使用table標(biāo)簽來創(chuàng)建一個(gè)表格
? ? *在table標(biāo)簽中使用tr來表示表格中的一行套硼,在tr中使用td表示一個(gè)單元格
? ? *使用rowspan來縱向的合并單元格氮发,使用colspan來橫向的合并單元格,在html中還為我們提供了一個(gè)th標(biāo)簽,專門用來表示表頭的單元格
? ? *我們?cè)趧?chuàng)建一個(gè)表格時(shí),如果沒有使用thead tbody tfoot(與元素位置有直接關(guān)系,thead永遠(yuǎn)在表格頂部玻蝌,tfoot在表格底部)這些標(biāo)簽時(shí),瀏覽器會(huì)自動(dòng)在頁(yè)面中添加tbody,并且將所有的tr都放到tbody中灶伊,所以實(shí)際上tr并不是table子元素疆前,而是tbody的子元素(即即使不寫瀏覽器也默認(rèn)存在table>tbody>tr結(jié)構(gòu))
? ? *表格可以嵌套使用(不常用)
表單form
? ? *form中有一個(gè)必須的屬性叫做action,action需要一個(gè)服務(wù)器的地址聘萨,當(dāng)我們提交表單時(shí)竹椒,填寫的內(nèi)容將會(huì)提交到action指向的地址(如果省略 action 屬性,則 action 會(huì)被設(shè)置為當(dāng)前頁(yè)面)
? ? *method 屬性規(guī)定在提交表單時(shí)所用的 HTTP 方法(GET或POST):
? ??????????????使用 GET(默認(rèn)) 時(shí)米辐,表單數(shù)據(jù)在頁(yè)面地址欄中是可見的(數(shù)據(jù)較短且沒有敏感信息時(shí)用)
? ??????????????POST 的安全性更加胸完,因?yàn)樵陧?yè)面地址欄中被提交的數(shù)據(jù)是不可見的
? ? *使用input標(biāo)簽來創(chuàng)建一個(gè)文本框
????????????- 它需要一個(gè)type屬性是text
????????????- 如果希望表單中的內(nèi)容最終發(fā)送到服務(wù)器,還必須要給表單項(xiàng)添加一個(gè)name屬性
該屬性將會(huì)作為用戶填寫內(nèi)容名字翘贮,在服務(wù)器中可以根據(jù)這個(gè)名字來獲取用戶填寫內(nèi)容
- 默認(rèn)情況下赊窥,用戶添加的內(nèi)容將會(huì)以查詢字符串的形式發(fā)送給服務(wù)器,
所謂的查詢字符串就是url地址?后邊的內(nèi)容,查詢字符實(shí)際上就是一個(gè)一個(gè)的名值對(duì)結(jié)構(gòu)狸页,多個(gè)名值對(duì)之間使用&隔開
- username=sunwukong&password=123123
? ? *可以通過value屬性為文本框指定一個(gè)默認(rèn)值
? ? *密碼框也是input锨能,不同的是它type需要使用password(輸入是不會(huì)以明文顯示出來)
? ? *單選按鈕
????????- 使用input來創(chuàng)建一個(gè)單選按鈕
????????- 它的type屬性值是radio
????????- 單選按鈕是通過name屬性來分組的,相同的name屬性值屬于一組
????????- 像這種選擇框不需要用戶填寫內(nèi)容的芍耘,還必須指定一個(gè)value屬性址遇,
????????????這樣選中的元素的value屬性值將會(huì)被提交到服務(wù)器
? ? ? ? ?- 如果希望某個(gè)單選按鈕處在默認(rèn)選中的狀態(tài)可以在標(biāo)簽中添加屬性 checked="checked"
多選框
? *? 使用input來創(chuàng)建一個(gè)多選框,它的type屬性是checkbox
下拉列表
- 使用select來創(chuàng)建一個(gè)下拉列表
- 使用option標(biāo)簽來創(chuàng)建下拉列表中的選項(xiàng)
- 下拉列表的name屬性需要指定給select標(biāo)簽斋竞,value屬性需要指定給option
- 如果希望將option設(shè)置為默認(rèn)選中倔约,則可以在option中添加一個(gè)屬性 selected = "selected"
提交按鈕
- 使用input來創(chuàng)建一個(gè)提交按鈕
- 它的type叫做submit
- 通過value屬性可以設(shè)置提交按鈕上的文字
普通按鈕
如果type設(shè)置為button,那么會(huì)生成一個(gè)普通的按鈕坝初,浸剩,它只有一個(gè)功能就是被點(diǎn)
按鈕button
也可以通過button標(biāo)簽來創(chuàng)建按鈕,使用button創(chuàng)建的按鈕和input創(chuàng)建的按鈕功能一致鳄袍,只不過button標(biāo)簽更加的靈活
<button type="submit">提交按鈕</button>
<button type="reset">重置</button>
<button type="button">單純的按鈕</button>