什么是表單
什么是表單元素
<form>
<表單元素>
</form>
常見的表單標簽
賬號:<input type="text">
- 暗文輸入框
密碼:<input type="password">
- 單選框radio
- 默認情況不會互斥既琴,設置name屬性且設置相同值
- 默認選中:checked
<input type="radio" name="gender" checked="checked">女
- 按鈕
- 作用:配合JS完成操作
- 格式:
<input type="button" value="我是按鈕">
- 圖片按鈕:
<input type="image" src="QRCode.jpg" width="10">
- 重置按鈕
- 清空表單中填好的數(shù)據(jù)
<input type="reset" value="清空">
- 提交按鈕
- 將表單中填寫好的數(shù)據(jù)提交到遠程服務器
- 給form表單添加action屬性指定需要添加到的服務器
<form action="http://www.520it.com">
<input type="submit">
- 隱藏域
- 配合提交按鈕將一些數(shù)據(jù)悄悄提交到服務器
- value:設置默認值
賬號:<input type="text" value="123">
<br>
密碼:<input type="password" value="123">
- label標簽
- 默認情況下文字和輸入框是沒有關聯(lián)的也拜,若想點擊文字時讓對應的輸入框聚焦,就需要讓文字和輸入框進行綁定
- 使用label標簽可以實現(xiàn)霎肯,格式如下
<label for="accout">賬號</label>:<input type="text" id="accout">
<br>
<label for="pwd">密碼</label>:<input type="password" id="pwd">
- 將文字用label標簽包裹起來
- 添加id屬性
- 通過label標簽中的for屬性和輸入框中的id屬性進行綁定
- dalist標簽
- 眾多瀏覽器不支持擎颖,僅了解即可
- 作用:給輸入框綁定待選項
- 格式:
<datalist>
<option value="">待選項內(nèi)容</option>
</datalist>
- 如何給輸入框綁定待選項
- 搞一個輸入框
- 搞一個datalist列表
- 給datalist添加id
- 給輸入框添加id屬性,且id的值即為對應的datalist的id
- select標簽
<select name="" id="">
<option value="">列表數(shù)據(jù)</option>
</select>
<option selected="selected">浙江</option>
- 可以通過給option標簽包裹一層optgroup標簽來給下拉列表中的數(shù)據(jù)分組
<select>
<optgroup label="北京">
<option>朝陽區(qū)</option>
<option>昌平區(qū)</option>
<option>通州區(qū)</option>
</optgroup>
<optgroup label="廣州">
<option>天河區(qū)</option>
<option>越秀區(qū)</option>
<option>黃浦區(qū)</option>
</optgroup>
</select>
<textarea name="" id="" cols="30" rows="10">
內(nèi)容
</textarea>
- 注意點:
- 默認情況下可無限換行
- 有默認的寬度和高度
- col和row指定列數(shù)行數(shù)
- fieldset標簽
- 作用:給表單添加一個邊框
- legend可以給邊框指定標題
最后編輯于 :
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者