<form>、<label>、<input>等
在HTML5中,表单的填写提交使用form标签,然后里面包含各种文字标签和输入项(文字输入框、单选按钮、多选按钮等),还有按钮等。
下面是一个简单的HTML表单:
<form action="/submitToServer" method="post">
<div>
<label for="name">名字:</label> <input type="text" id="name" name="user_name">
</div>
<div>
<label for="mail">E-mail:</label> <input type="email" id="mail" name="user_mail">
</div>
<div>
<label for="msg">信息:</label> <textarea id="msg" name="user_message"></textarea>
</div>
<div class="button">
<button type="submit">提交</button>
</div>
</form>
<form>内的action和method属性分别用来指定提交表单数据的目标地址(URL)以及HTTP的请求方式(post或get)。
<label>是表单项的文字标签,可以使用for属性来指定绑定的表单输入项(input的id属性),通过绑定可以点击标签将焦点定位到对应表单项。
<input>根据type属性的不同来显示不同的表单项,默认就是这里的"text",代表单行文本输入,另外还有email、radio和checkbox等,详情可参考input类型。
<textarea>跟input类似,但是可以输入多行的文本,详细的属性控制可参考<textarea>。
<button>设置type为“submit”,即将数据发送到服务器,而type默认是"button"(点击无任何响应,需要自己写JavaScript指定响应操作)。
另外值得一提的是,<input>也可以指定type为“button”,默认显示的效果与<button>一样,但是<input>所对应的按钮只能通过value属性来指定按钮文字,因此不受CSS的影响。