HTML 标签的 for 属性

for 属性规定 label 与哪个表单元素绑定。

隐式和显式的联系

label通常以下面两种方式中的一种来和表单控件相联系:

  1. 将表单控件作为标记标签的内容,这样的就是隐式形式
  2. 或者为 label 标签下的 for 属性命名一个目标表单 id,这样就是显式形式

例如,在 XHTML 中:

显式的联系:

<label for="SSN">Social Security Number:</label>

<input type="text" name="SocSecNum" id="SSN" />

隐式的联系:

<label>Date of Birth: <input type="text" name="DofB" /></label>

第一个标记是以显式形式将文本 “Social Security Number:” 和表单的社会安全号码的文本输入控件 (“SocSecNum”) 联系起来,它的 for 属性的值和控件的 id 一样,都是 SSN。

第二个标记 (“Date of Birth:”) 不需要 for 属性,它的相关控件也不需要 id 属性,它们是通过在 label标签中放入 input 标签来隐式地连接起来的。

<span>状态:</span>
<div class="checkbox checkbox-success checkbox-inline" style="margin-right: 0px;"> <input type="checkbox" id="state1" value="1" name="statusName" checked>
<label for="state1"> 审核通过 </label>
</div>
<div class="checkbox checkbox-success checkbox-inline" style="margin-right: 0px;">
<input type="checkbox" id="state2" value="0" name="statusName" checked>
<label for="state2"> 待项目审核 </label>
</div>

HTML标签的for属性的更多相关文章

  1. HTML <a> 标签的 target 属性

    HTML <a> 标签的 target 属性 HTML <a> 标签 定义和用法 <a> 标签的 target 属性规定在何处打开链接文档. 如果在一个 <a ...

  2. JS组件系列——使用HTML标签的data属性初始化JS组件

    前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里 ...

  3. 常见标签的默认属性值及相互作用——关于CSS reset的思考

    在现在的网站设计中使用reset.css用重置整个站点的标签的CSS属性的做法很常见,但有时候我们已经为了reset而reset,我们经常看到这样的reset代码 div{ padding:0px; ...

  4. 局部(或全局)设置<a>标签的target属性

            对于超链接<a>标签,target属性的设置是比较关键的,在不同的用户场景下选用适合的新页面载入方式,可以大大的提高访客的体验感.我们一般对target的设置可以挨个来,但 ...

  5. 【HTML5 video】video标签的部分属性解析

    转自:http://www.cnblogs.com/kiter/archive/2013/02/25/2932157.html 现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Th ...

  6. HTML5 <a>标签的ping属性用法

    随着移动互联网用户井喷式的增长,web前端开发中的HTML5在近几年备受瞩目,越来越多的人从事html5开发相关工作.今天小编也来凑个热闹,和大家一起来谈谈HTML5中<a>标签的ping ...

  7. 查看某个html标签有哪些属性和事件

    <html><head><script> //查看input标签有哪些属性和事件 function a() { var str = new String(" ...

  8. HTML <input> 标签的 type 属性

    HTML <input> 标签的 type 属性 HTML <input> 标签 实例 下面的表单拥有两个输入字段以及一个提交按钮: <form action=" ...

  9. HTML<label> 标签的 for 属性

    定义和用法 for 属性规定 label 与哪个表单元素绑定. 隐式和显式的联系 标记通常以下面两种方式中的一种来和表单控件相联系:将表单控件作为标记标签的内容,这样的就是隐式形式,或者为 <l ...

  10. a标签无disabled属性

    <a class="button">确认</a> 我们经常会用a标签来设置按钮样式,如果点击它跳转页面,那么没有任何问题. 如果绑定了ajax事件,即点击后 ...

随机推荐

  1. [UWP]使用PointLight并实现动画效果

    1. Composition Lighting UWP中的Composition Light是一组可以创建3D光照的API,它明明十分好玩而且强大, 但博客园几乎没有相关文章(用UWP或pointli ...

  2. NOI1995 石子合并 [Luogu P1880]

    一道区间dp的模板题,这里主要记一下dp时环形数据的处理. 简略版:方法一:枚举分开的位置,将圈化为链,因此要做n次. 方法二:将链重复两次,即做一个2n-1长度的链,其中第i(i<=n)堆石子 ...

  3. 利用python的requests和BeautifulSoup库爬取小说网站内容

    1. 什么是Requests? Requests是用Python语言编写的,基于urllib3来改写的,采用Apache2 Licensed 来源协议的HTTP库. 它比urllib更加方便,可以节约 ...

  4. GERALD07加强版:lct,主席树,边化点

    Description:N个点M条边的无向图,询问保留图中编号在[l,r]的边的时候图中的联通块个数. 传送门. lct这么神仙的东西一个题解都不写怎么行??? 神仙思路啊. 其实不是很难但是的确不容 ...

  5. 「刷题」可怜与STS

    又是一道假期望,我们发现一共有$ C_{2n}^m $种情况. 而$ \frac{(2n)!}{m!(2n-m)!}=C_{2n}^m $ 其实结果就是各个情况总伤害. 1.10分算法,爆搜10分. ...

  6. 问题 C: 「Usaco2010 Dec」奶牛健美操O(∩_∩)O

    题目描述 Farmer John为了保持奶牛们的健康,让可怜的奶牛们不停在牧场之间的小路上奔跑.这些奶牛的路径集合可以被表示成一个点集和一些连接 两个顶点的双向路,使得每对点之间恰好有一条简单路径.  ...

  7. ELK分布式日志+NLog在.NetCore中的应用

    一.ELK简介 ELK是Elasticsearch.Logstash和Kibana首字母的缩写.这三者均是开源软件,这三套开源工具组合起来形成了一套强大的集中式日志管理平台 Elasticsearch ...

  8. Windows终端利器Cmder

    在IT这一行,大部分情况下都是推荐大家使用Linux或者类Unix操作系统去编程,Linux作为一代优秀的操作系统,已经人尽皆知,在IT行业已经成为核心.有条件的大佬都选择了使用mac编程,最优秀的莫 ...

  9. Ansible之playbook拓展

    一.handlers和notify结合使用触发条件 handlers同tasks是属同级,相当于一个特殊任务列表,这些任务同前文说的tasks里的任务没有本质的不同,用于当关注的资源发生变化时,才会采 ...

  10. Material for oauth 2

    oauth 2 in 8 steps:  https://knpuniversity.com/screencast/oauth Live demo of oauth 2 (with server im ...