html:(21):重置按钮和label标签
生活随笔
收集整理的這篇文章主要介紹了
html:(21):重置按钮和label标签
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
使用重置按鈕,重置表單信息
當用戶需要重置表單信息到初始時的狀態時,比如用戶輸入“用戶名”后,發現書寫有誤,可以使用重置按鈕使輸入框恢復到初始狀態。只需要把type設置為"reset"就可以。
語法:
<input?type="reset" value="重置">
type:只有當type值設置為reset時,按鈕才有重置作用
value:按鈕上顯示的文字
舉例:
在瀏覽器中顯示的結果:
輸入賬號
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>重置按鈕</title> </head> <body> <form action="save.php" method="post" ><label>愛好:</label><select><option value="看書">看書</option><option value="旅游" selected="selected">旅游</option><option value="運動">運動</option><option value="購物">購物</option></select><input type="submit" value="確定" /><input type="reset" value="重置" /> </form> </body> </html>運行結果
form表單中的label標簽
小伙伴們,你們在前面學習表單各種控件的時候,有沒有發現一個標簽--label,這一小節就來揭曉它的作用。
label標簽不會向用戶呈現任何特殊效果,它的作用是為鼠標用戶改進了可用性。如果你在 label 標簽內點擊文本,就會觸發此控件。就是說,當用戶單擊選中該label標簽時,瀏覽器就會自動將焦點轉到和標簽相關的表單控件上(就自動選中和該label標簽相關連的表單控件上)。
語法:
<label for="控件id名稱">注意:標簽的 for 屬性中的值應當與相關控件的 id 屬性值一定要相同。
例子:
<form><label for="male">男</label><input type="radio" name="gender" id="male" /><br /><label for="female">女</label><input type="radio" name="gender" id="female" /><label for="email">輸入你的郵箱地址</label><input type="email" id="email" placeholder="Enter email"> </form> <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>form中的lable標簽</title> </head><body> <form><label for="male">男</label><input type="radio" name="gender" id="male" /><br /><label for="female">女</label><input type="radio" name="gender" id="female" /><br /><label for="email">輸入你的郵箱地址</label><input type="email" id="email" placeholder="Enter email"></form></body> </html>運行結果
總結
以上是生活随笔為你收集整理的html:(21):重置按钮和label标签的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微信小程序统一封装request请求,统
- 下一篇: java学习(144):file常用方法