HTML 表单与输入实例
1.<form> 标签用于为用户输入创建 HTML 表单。
表单能够包含<input>元素，比如文本字段、复选框、单选框、提交按钮等等
<input> 标签用于搜集用户信息。
action 规定当提交表单时向何处发送表单数据
在 HTML 中，<input> 标签没有结束标签
根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
value 规定 input 元素的值。
button定义可点击按钮
checkbox定义复选框
file定义输入字段和 "浏览"按钮，供文件上传
hidden定义隐藏的输入字段
image定义图像形式的提交按钮。
password定义密码字段。该字段中的字符被掩码
radio定义单选按钮
reset定义重置按钮。重置按钮会清除表单中的所有数据
submit定义提交按钮。提交按钮会把表单数据发送到服务器。
text定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。
e.g
1.<form>名
<input type="text" name="firstname">
姓<input type="text" name="lastname">
</form>
2.<form>
用户
<input type="text" name="user">
密码<input type="password" name="password">
</form>
3.<form>
我喜欢自行车
<input type="checkbox" name="bike">
我喜欢汽车
<input type="checkbox" name="car">
</form>
4.<form>
男:<input type="radio" check="check" name="sex" value="male">
女:<input type="radio" name="sex" value="female">
</form>
2.下拉列表
select 元素可创建单选或多选菜单
<select> 元素中的 <option> 标签用于定义列表中的可用选项。
name规定下拉列表的名称
size规定下拉列表中可见选项的数目
option 元素定义下拉列表中的一个选项（一个条目）。
浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示。
option 元素位于 select 元素内部
value定义送往服务器的选项值
e.g
<form>
<select name="cars">
<option value="宝马">宝马</option>
<option value="奔驰">奔驰</option>
<option value="玛莎拉蒂" selected="selected"这是一个预先设置>玛莎拉蒂</option>
<option value="奥迪">奥迪</option>
</select>
</form>
文本域：用户可以在文本域中写入文本。在文本域中，可写入的字符字数不受限制
<textarea rows="30" cols="50">
The cat was playing in the garden.
3.创建按钮
<form>
<input type="button" value="点击">
</form>
4.<fieldset>在数据周围绘制一个带标题的框
fieldset 元素可将表单内的相关元素分组。
<fieldset> 标签将表单内容的一部分打包，生成一组相关表单的字段。
当一组表单元素放到 <fieldset> 标签内时，浏览器会以特殊方式来显示它们，它们可能有特殊的边界、3D 效果，或者甚至可创建一个子表单来处理这些元素。
<fieldset> 标签没有必需的或唯一的属性。
<legend> 标签为 fieldset 元素定义标题。
e.g
<form>
<fieldset>
<legend>健康信息</legend>
身高：<input type="text">
体重：<input type="text">
</fieldset>
</form>
表单实例
带有输入框和确认按钮的表单
e.g<form action="www.baidu.com">
First name:
<input type="text" name="firstname" value="Mickey"></br>
Last name:
<input type="text" name="lastname" value="Mouse">
<input type="submit" value="Submit">
</form>
网友评论