1. input标签:
<input> 用于搜集用户信息。
根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
2. 单行文本
<br />
公司名:
<input type="text" name="company" readonly="true" value="格伦有限公司" />
<br />
用户名:
<input type="text" name="username" maxlength="6" />
<br />
密 码:
<input type="password" name="password" />
3. 文本域
<h2>文本域</h2>
<textarea rows="5" cols="20"></textarea>
20列之后会自动换行
4. 单选框
<input type="radio" name="sex" />男
<input type="radio" name="sex" />女
<input type="radio" name="sex" />女博士
Type为radio即为单选按钮,name相同的单选按钮为一组,选择时互斥。
5. 复选框
<h2>复选框</h2>
爱好: <br />
<input type="checkbox" />旅游
<input type="checkbox" />看电影
<input type="checkbox" />学习
6. Label
label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。
就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上<label> 标签的 for 属性应当与相关元素的id 属性相同。
具例来说,上面的复选框只有点方框才能打钩,点文字是没有反映的,如果希望点文字也达到钩选的效果,就需要使用label把文字包起来,而且使用for属性和方框关联起来:
<h2>label</h2>
可点击文字选中: <br />
<input type="checkbox" id="trip"/><label for="trip">旅游</label>
<input type="checkbox" id="movie"/><label for="movie">看电影</label>
<input type="checkbox" id="study"/><label for="study">学习</label>
7. 文件域
<h2>文件域</h2>
任意文件:<input type="file"/>
<br />
单频视频:<input type="file" name="res" accept="audio/*,video/*" />
<br />
图片文件:<input type="file" name="pic" accept="image/*" />
audio/* 可以接受所有的音频文件
video/* 可以接受所有的视频文件
image/* 可以接受所有的图片文件