label 的for属性总结
一、使用介绍
1. 定义:for属性规定label与哪个表单元素绑定。
<label>是专门为<input>元素服务的,为其定义标记。
label 和表单控件绑定方式有两种:
方法一:将表单控件作为label的内容,这种就是隐士绑定。
此时不需要for属性,绑定的控件也不需要id属性。
隐式绑定:
<label>Date of Birth: <input type="text" name="DofB" /></label>
方法二:为label标签下的for属性命名一个目标表单的id,这种就是显示绑定。
显式绑定:
<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSN" />
二、为什么要给label上面加上for属性
给 label 加了 for 属性绑定了input控件后,可以提高鼠标用户的用户体检。
如果在label 元素内点击文本,就会触发此控件,也就是说,当用户渲染该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
补充:
label 的 for属性给 select绑定 ,点击Male ,select只会闪下(自己测试的):
<label for="male">Male</label>
<select id="male">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<label for="female">Female</label>
<select>
<option>一</option>
<option>二</option>
<option>三</option>
</select>
html5给<label>新增了一个form属性来规定label所属的一个或多个表单,多个表单用空格分隔。
参考资料:http://www.cnblogs.com/starof/p/4545525.html
label 的for属性总结的更多相关文章
- WinForms中的Label的AutoSize属性
当大量使用UserControl组合UI时,如果更改了Label的Text属性,Label.AutoSize属性会影响UserControl的OnLoad事件的发生顺序; public overrid ...
- label的for属性
一.使用介绍 <label>专为input元素服务,为其定义标记. for属性规定label与哪个表单元素绑定 label和表单控件绑定方式又两种: 1.将表单控件作为label的内容,这 ...
- label标签的属性
//label标签的属性 - (void)viewDidLoad { //初始化一个label1标签对象,初始化有很多方法,最原始的就是init,此处用带有frame的方法 UILabel *labe ...
- 用图片作为label,for属性IE下不起作用
IE浏览器存在一个BUG,当你使用label的for属性达到点击label使对应的表单元素聚焦,label中的内容为图片时,IE浏览器下不起作用. 例如: <input type="c ...
- 关于<label>的for属性的简单探索
在freecodecamp上HTML教程的Create a Set of Radio Buttons这一节中,看到这样一段话, It is considered best practice to se ...
- label 的autosize属性
label 的autosize属性,显示不全的问题.
- <label>标签for属性的妙用
在用户注册的时候,常常用户点击文字就需要将光标聚焦到对应的表单上面,这个是怎么实现的呢?就是下面我要介绍的<label>标签的for属性 定义:for 属性规定 label 与哪个表单元素 ...
- html中label及加上属性for之后的用法
定义和用法 <label> 标签为 input 元素定义标签(label). label 元素不会向用户呈现任何特殊的样式.不过,它为鼠标用户改善了可用性,因为如果用户点击 label 元 ...
- <label>标签for属性
label 元素不会向用户呈现任何特殊效果.不过,它为鼠标用户改进了可用性.如果您在 label 元素内点击文本,就会触发此控件.就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控 ...
随机推荐
- Scrapy详解
一.爬虫生态框架 在管道传数据只能传字典和items类型. 将 上一return语句注释则会报错 如: 如上图,爬虫文件中有一个name属性,如果多个爬虫可以通过这个属性在管道控制分析的是哪个爬虫的 ...
- IT题库5-并发和并行
并发和并行从宏观上来讲都是同时处理多路请求的概念.但并发和并行又有区别,并行是指两个或者多个事件在同一时刻发生:而并发是指两个或多个事件在同一时间间隔内发生.
- requests库
还没整理,先贴俩链接. https://www.cnblogs.com/lilinwei340/p/6417689.html http://docs.python-requests.org/zh_CN ...
- Hibernate的工作原理及使用的原因
一.工作原理: 1.读取并解析配置 2.读取并解析映射信息,创建Session Factory 3.打开Session 4.创建事务Transation 5.持久化操作 6.提交事务 7.关闭Sess ...
- java 命令查字节码文件, 查.class文件内容
1. 需要用javac,javap命令,所以先配下环境变量 2.配置环境变量 单击“计算机-属性-高级系统设置”,单击“环境变量”.在“系统变量”栏下单击“新建”,创建新的系统环境变量. 3.写需要用 ...
- Makefile 编译时虽然加上了-g 选项 但是还是无法调试
make 编译时默认的命令是all,不能写成其他的
- vue实现验证码倒计时60秒的具体代码
vue实现验证码倒计时60秒的具体代码 <span v-show="show" @click="getCode">获取验证码</span> ...
- Github-记账本
- Flutter进阶—点击、拖动和其他手势
Flutter中的手势系统有两个层次.第一层具有原始指针事件,其描述了穿过屏幕的指针(例如触摸.鼠标和触控笔)的位置和移动.第二层具有手势,其描述由一个或多个指针移动组成的语义动作. 指针指针代表用户 ...
- 终于有人把云计算、大数据和 AI 讲明白了
最近学习hadoop以及生态,顺便看到了这篇文章,总结的很到位,转载下. 我今天要讲这三个话题,一个是云计算,一个大数据,一个人工智能,我为什么要讲这三个东西呢?因为这三个东西现在非常非常的火,它们之 ...