HTML5表單代碼制作是Web開發(fā)中的重要組成部分,良好的HTML5表單代碼可以讓網(wǎng)頁結構更加清晰美觀,也可以提高用戶填寫表單的效率。因此,制定HTML5表單代碼制作規(guī)范是非常必要的。
<form action="submit.php"> <label for="name">姓名</label> <input type="text" id="name" name="name" required> <label for="email">電子郵件</label> <input type="email" id="email" name="email" required> <label for="password">密碼</label> <input type="password" id="password" name="password" required> <button type="submit">提交</button> </form>
首先,<form>
標簽包裹表單,其中action
屬性指定表單提交的地址。其次,每一個表單元素都應該使用<label>
標簽進行標注,為后續(xù)的CSS樣式及JS操作提供基礎。此外,for
屬性要與相應輸入控件的id
屬性保持一致,可以提高無障礙可用性。
輸入控件最常見的類型為:input
標簽,在HTML5中,type
屬性新增了豐富的選擇,如:text、tel、email、password、url、number等,可以根據(jù)需求進行選擇。其中,required
屬性用于表明該項為必填項,可以在瀏覽器端進行填寫驗證,也可以通過JS判斷是否有值。
最后,表單的提交按鈕使用<button>
標簽進行包裝,同時,需要type="submit"
屬性,這樣點擊按鈕就可以將表單提交到指定地址。此外,還可以添加屬性disabled
來進行提交按鈕的禁用,避免重復提交。
上一篇js點擊事件css樣式
下一篇js消除css 邊框顏色