1派继、什么是表單入愧?
HTML 表單用于搜集不同類(lèi)型的用戶(hù)輸入,用來(lái)收集信息,例如:調(diào)查問(wèn)卷,登錄,注冊(cè)等...
2恃轩、表單元素
其實(shí)還是HTML中的一些標(biāo)簽, 只不過(guò)這些標(biāo)簽比較特殊, 在瀏覽器中所有的表單標(biāo)簽都有特殊的外觀(guān)和默認(rèn)的功能
3锁荔、元素
在HTML中 標(biāo)簽/標(biāo)記/元素都是指HTML中的標(biāo)簽
例如: <a> a標(biāo)簽/a標(biāo)記/a元素
4蟀给、表單格式
<form>
<表單元素>
</form>
5、常見(jiàn)的表單元素:
表單元素指的是不同類(lèi)型的 input 元素阳堕、復(fù)選框跋理、單選按鈕、提交按鈕等等恬总。
<input> 元素是最重要的表單元素前普。
input標(biāo)簽有一個(gè)type屬性, 這個(gè)屬性有很多類(lèi)型的取值, 取值的不同就決定了input標(biāo)簽的功能和外觀(guān)不同
6、input的type屬性常見(jiàn)取值
text 文本域
password 密碼域
radio 單選按鈕
checkbox 復(fù)選框
button 樣式為一個(gè)按鈕
image 圖片樣式
file 獲取文件樣式
reset 重置按鈕樣式
submit 提交按鈕樣式
hidden 隱藏域
7壹堰、表單元素一定要寫(xiě)在表單中,如果不寫(xiě)也可以顯示,但是在執(zhí)行提交,重置操作的時(shí)候可能會(huì)有問(wèn)題
8拭卿、<input type="text">
通過(guò)value設(shè)置默認(rèn)值
9、<input type="password">
通過(guò)value設(shè)置默認(rèn)值
10贱纠、<input type="radio" >
單選框默認(rèn)不會(huì)互斥,若要實(shí)現(xiàn)多個(gè)單選框火熾就要,通過(guò)name屬性給多個(gè)單選框設(shè)置同一個(gè)值
默認(rèn)選中,通過(guò)checked屬性設(shè)置,如:checked="checked"
11峻厚、<input type="checkbox">
多選框默認(rèn)選中也是通過(guò)checed="checked"進(jìn)行設(shè)置
如果設(shè)置屬性的名字和值一樣,可以只寫(xiě)屬性省略等號(hào)和值
<input type="checkbox" checked="checked">
<input type="checkbox" checked="checked">
不推薦使用
<body>
<!--
form: 是一個(gè)復(fù)合標(biāo)簽
格式:
<form>
相關(guān)表單元素/標(biāo)簽/標(biāo)記
</form>
相關(guān)元素/標(biāo)簽/標(biāo)記:
input: 輸入 (文本域,密碼域,單選框,復(fù)選框),通過(guò)type屬性進(jìn)行制定
非input元素
屬性:
action: 是為了制定把收集的信息發(fā)送到的地址, 如果是網(wǎng)絡(luò)地址一定要加上協(xié)議:(http://)
注意點(diǎn):
1. 所有表單元素,必須要寫(xiě)在form標(biāo)簽之內(nèi)
-->
<form action="">
<!--
input 標(biāo)簽
type: 指定輸入類(lèi)型
value: 設(shè)置默認(rèn)的值
不會(huì)自動(dòng)換行
name: 告訴服務(wù)器,收集的哪一個(gè)信息,只有表單元素具備name屬性的時(shí)候,才會(huì)把相應(yīng)的信息發(fā)送到服務(wù)器
-->
<!--1,文本域,單行
type="text"
type: 指定輸入類(lèi)型
value: 設(shè)置默認(rèn)的值
placeholder: 提供默認(rèn)的提示信息,沒(méi)有輸入文字的,會(huì)出現(xiàn)
-->
請(qǐng)輸入賬戶(hù): <input type="text" placeholder="務(wù)必輸入漢語(yǔ)" name="name">
<!--
2.密碼域:
type: password
-->
<br>
請(qǐng)輸入密碼: <input type="password" value="1235456" name="ps">
<!--
3. 單選框
type: radio:收音機(jī)
如果沒(méi)有指定值,默認(rèn)就是on/off,為了服務(wù)器辨別,指定value值
注意:要實(shí)現(xiàn)單選的功能,要指定name屬性相同的值
-->
<br>
性別: 男<input type="radio" name="sex" value="male"> 女<input type="radio" name="sex" value="fmale">
<!--
4. 復(fù)選框
type: checkbox
要指定相同的name值
如果沒(méi)有指定值,默認(rèn)就是on/off,為了服務(wù)器辨別,指定value值
-->
<br>
興趣愛(ài)好:
籃球<input type="checkbox" name="love" value="basketball">
排球<input type="checkbox" name="love" value="pai">
乒乓球<input type="checkbox" name="love" value="ping">
鉛球<input type="checkbox" name="love" value="qian">
選擇文件:<input type="file">
<input type="submit">
</form>
</body>
http://www.w3school.com.cn/html/html_forms.asp
http://www.w3school.com.cn/html/html_form_elements.asp
http://www.w3school.com.cn/html/html_form_input_types.asp
http://www.w3school.com.cn/html/html_form_attributes.asp
http://www.w3school.com.cn/tags/tag_input.asp