表单域
表单标签
使⽤表达的⽬的收集⽤户信息。
在HTML中,⼀个完整的表单通常由表单域、表单控件(也称为表单元素)和提⽰信息
三部分构成。
表单域
表单域是⼀个包含单元素的区域。在HTML标签中,标签⽤于定义表单域,以实现⽤户信息的收集和传递。会把他范围内的表单元信息提交给服务器。
<form action="url地址" method="提交⽅式" name="表单域名称">
各种表单元素控件
</form>
表单控件
1. input输⼊表单元素
在表单元素中input标签⽤于收集⽤户信息。在此标签中包含⼀个type属性,根据不同的type属性值,输⼊字段拥有很多种形式(可以是⽂本字段、复选框、掩码后的⽂本控件、单选按钮、按钮等。
<input type="属性值"/>
<from>
<!-- text ⽂本框⽤户可以在⾥⾯输⼊任何⽂字 placeholder="请输⼊名字" 对⽐value ⽂字颜⾊较浅,输⼊⽂字⾃动消失-->
姓名:<input type="text" name="username" value="请输⼊名字"> <br>
<!-- password 密码框⽤户看不见输⼊的密码 -->
密码:<input type="password" name="pwd"> <br>
<!-- radio 单选按钮可以实现多选⼀ -->
<!-- name 是表单元素的名字这⾥性别单选按钮必须有相同的名字name 才可以实现多选1 -->
性别:男<input type="radio" name="sex"> ⼥ <input type="radio" name="sex"> <br>
<!-- checkbox 多选按钮可以实现多选 -->
爱好:吃饭 <input type="checkbox"> 睡觉 <input type="checkbox"> 发呆 <input type="checkbox"> <br>
<!-- 单选按钮和复选框可以设置checked 属性,当页⾯打开时默认选中这个按钮 -->
<input type="checkbox" checked="checked">我同意注册条款
</from>
1. name和value是每个表单元元素都有的属性,主要给后台⼈员使⽤。
2. name表单元素的名字,要求单选按钮和复选框要有相同的name值
3. checked属性主要针对于单选按钮和复选框,主要作⽤⼀打开页⾯,就可以默认选中某个表单元素。
4. maxlength是⽤户可以在表单元素输⼊的最⼤字符数,⼀般较少使⽤。
label标签
标签为input元素定义标注
label标签⽤于绑定⼀个表单元素,当点击label标签内的⽂本时,浏览器就会⾃动将焦点转到或者选择对应表单元素上,⽤来增加⽤户体验。
<label for="sex">男</label>
<input type="radio" name="sex" id="sex"/>
<!---
<label>标签的for属性应当与相关元素的id属性相同。
input标签placeholder属性--->
select表单元素
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论