label 标签的巧妙使用
欢迎来到Altaba的博客 2017年1月23日
关于label，标签，大家印象应该是表单中和input在一起绑定使用的，方便点击，这也是label的核心功能，首先，引用W3C的具体描叙，让不了解的童鞋先初步认识一下
<label> 标签为 input 元素定义标注（标记）。
label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
<label> 标签的 for 属性应当与相关元素的 id 属性相同。
咱在这篇文章是介绍label的巧妙使用，重点来了！
<input type="text" name="" id="text" /><label for="text">一个label，配文本框</label><br/> <input id="User3" type="radio" name="gender" value="3"> <label for="User3">label配radio</label> 这样点击label里面的文字，text框获取到焦点，radio会被点击，非常方便
还可以这样嵌套包围实现
<label><input type="checkbox" name="aksd" id="aksd" />包围起来</label>建议，不包围去使用，用其for属性指定到具体的表单元素，这样即使两个分割两地很远，也能绑定，况且：label包input的方法，在IE6下无效！所以建议不嵌套
巧妙使用：label不仅仅使用与表单，当你需要实现：点击一个图片或者文字A会触发另外一个B的点击事件，只要将label A的for指向B的ID，非常方便，会省去很多JS代码
label 标签的巧妙使用相关推荐
- 表单之label标签
表单之label标签 文章目录 表单之label标签 视频 代码 视频 https://www.bilibili.com/video/BV16s411N7sM?from=search&seid ...
- python label怎么用_python tkinter label标签怎么使用？
终于有机会给大家介绍了label标签内容,想必很多小伙伴已经迫不及待听小编说这个最常见的标签函数了吧,大家之所以喜欢,主要还是依赖于这个标签是我们每一次的编程必备,看着大家如此喜欢这个函数,一进入控件 ...
- html form label标签基础语法结构与使用案例教程(转载)
在表单布局中会遇到label标签的使用,label没有任何样式效果,有触发对应表单控件功能. 比如我们点击单选按钮或多选框前文字对应选项就能被选中,这个就是对文字加了<label>标签实现 ...
- html label标签 ie6,说说HTML5中label标签的可访问性问题
一.开篇叨叨 一般稍微有些经验的页面制作人员都知道label标签可以优雅地扩大表单控件元素的点击区域,例如,单纯的单选框点击区域就鼻屎那么大的地方,经常会点不到位置.因此,label标签的使用对于提高 ...
- NGUI 3.5教程（二）Label 标签 (Hello world)、多行文本
写在前面: 本文将创建NGUI的第一个样例.依照编程传统,第一个样例,就是做一个Hello world 显示出来.NGUI.我们用Label来实现 . 欢迎大家纠错.拍砖!原创非常辛苦,如有转 ...
- HTML中Div、span、label标签的区别
div与span 通俗地讲就是如果里面还有其他标签的时候就用div,如果里面只有文本就应该用span span与label 由于有了以上关于span的说法,那么我们就可以对文本进行span的容器操作了 ...
- python编译成class_django为Form生成的label标签添加class方式
使用Form生成html标签的时候,虽然提供了widget的方法可以自定义标签的要是,但是只能给生成的input标签添加样式,对于生成的label标签无法添加样式. 而很多场景下需要为label和in ...
- HTML label标签学习笔记
网址:https://www.w3schools.com/tags/tag_label.asp label能够为下列HTML元素定义标签: 使用label的两个收益: Screen reader us ...
- SAP Spartacus User form通过label标签的实现原理
第一次见到这个有点诧异,居然是通过label实现的: 上述页面可以从SAP Spartacus User list,点击某个user进入明细页面开始编辑: 看到这个ng-reflect-name=ro ...
最新文章
- Javascript事件集
- 在打印预览模式下使用Chrome的Element Inspector？
- 如何学习sql语言？
- 登陆时验证码的制作（asp.net）
- python中dtype什么意思_浅谈python 中的 type(), dtype(), astype()的区别
- 华为鸿蒙os什么时候发布,鸿蒙OS将于今天发布
- 物品的名字、品牌的认识
- MySQL-快速入门（14）MySQL性能优化
- Linux可执行文件
- Unity工具——SVN工具
- JRebel:Cannot reactivate, offline seat in use.
- html 脚本错误,脚本错误怎么解决,教您脚本错误怎么解决?
- MapReduce强化实验
- Adversarial Attack的粗略总结
- 海贼王 动漫 全集目录 分章节 精彩打斗剧集
- 模仿某招聘网站的Js搜索菜单
- 安卓手机管理软件_安卓苹果手机电池使用久了该不该换
- flashwindow vb_VB6.0 加载ShockwaveFlash（flash）控件
- 良知的清醒常常意味着糟糕的记忆力的标志。
- python自动化测试学习笔记合集二