定义和用法

<label> 标签为 input 元素定义标签(label)。

label 元素不会向用户呈现任何特殊的样式。不过,它为鼠标用户改善了可用性,因为如果用户点击 label 元素内的文本,则会切换到控件本身。

<label> 标签的 for 属性应该等于相关元素的 id 元素,以便将它们捆绑起来。

实例

带有两个输入字段和相关标签的简单 HTML 表单:

<form>
<label for="male">Male</label>
<input type="radio" name="sex" id="male" />
<br />
<label for="female">Female</label>
<input type="radio" name="sex" id="female" />
</form> 例如:

<!DOCTYPE HTML>
<html>
<body>

<form>
<label for="male">Male</label>
<input type="radio" name="sex" id="male" />
<br />
<label for="female">Female</label>
<input type="radio" name="sex" id="female" />
</form>

</body>
</html>

以上代码会显示如上图所示的效果,点击male和female或者两个圆点的时候,都能起到同样的效果

也就是通过label和它的for属性,把操作方式联系在了一起


html中label及加上属性for之后的用法的更多相关文章

  1. python中string模块各属性以及函数的用法

    任何语言都离不开字符,那就会涉及对字符的操作,尤其是脚本语言更是频繁,不管是生产环境还是面试考验都要面对字符串的操作.     python的字符串操作通过2部分的方法函数基本上就可以解决所有的字符串 ...

  2. 牛人总结python中string模块各属性以及函数的用法,果断转了,好东西

    http://blog.chinaunix.net/uid-25992400-id-3283846.html http://blog.csdn.net/xiaoxiaoniaoer1/article/ ...

  3. shell脚本中的逻辑判断 文件目录属性判断 if特殊用法 case判断

    case判断 • 格式 case  变量名 in                       value1)                           command            ...

  4. 关于<label>的for属性的简单探索

    在freecodecamp上HTML教程的Create a Set of Radio Buttons这一节中,看到这样一段话, It is considered best practice to se ...

  5. WinForms中的Label的AutoSize属性

    当大量使用UserControl组合UI时,如果更改了Label的Text属性,Label.AutoSize属性会影响UserControl的OnLoad事件的发生顺序; public overrid ...

  6. WPF中Label使用StringFormat

    1. 在WPF中Label的Content有时内容只需要改变个别数字,而不需要所以内容都修改,这时候就要使用StringFormat, 如: <Label Content="I hav ...

  7. HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次)

    HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次) 一.总结 一句话总结:目录就是测试题 1.document取得元素(get element)的方式有哪几种? 解答:四种,分别是id ...

  8. C#在WinForm开发中Label换行方法

    很多朋友都会在开发WinForm中遇到Label要显示的内容太长,但却不能换行的问题.这里我总结了几种方法,供大家参考. 第一种是把Label的AutoSize属性设为False,手动修改Label的 ...

  9. [原创]java WEB学习笔记59:Struts2学习之路---OGNL,值栈,读取对象栈中的对象的属性,读取 Context Map 里的对象的属性,调用字段和方法,数组,list,map

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

随机推荐

  1. 消息中间件activemq-5.14.1安全验证配置

    activemq分为控制端和客户端,下面分别介绍安全认证配置方法. 1.控制端安全配置 (1). ActiveMQ目录conf下找到jetty.xml: <bean id="secur ...

  2. CallByValue和CallByName区别

    /** * Created by root * Description :CallByValue:进入函数就得先计算实参的值:CallByName:函数体重使用到的时候才计算 */ object Ca ...

  3. 第一篇:Hadoop简介

    前言 本文大致介绍下Hadoop的一些背景知识,为后面深入学习打下铺垫. 什么是Hadoop Hadoop是一个开源分布式计算平台,它以HDFS文件系统和MapReduce计算框架为核心. 前者能够让 ...

  4. RabbitMq 之简单队列

    简单队列类似于我们的生产者,消费者, 一个生产者,对应一个消费者. 直接上代码: package com.j1.rabbitmq.simple; import com.j1.rabbitmq.util ...

  5. codeforces水题100道 第四题 Codeforces Round #105 (Div. 2) A. Insomnia cure (math)

    题目链接:http://www.codeforces.com/problemset/problem/148/A题意:求1到d中有多少个数能被k,l,m,n中的至少一个数整出.C++代码: #inclu ...

  6. activeMQ---->ActiveMQ的使用(一)

    这里通过一个入门的案例来体会一下ActiveMQ的作用以及使用方法.你要做一个不动声色的大人了.不准情绪化,不准偷偷想念,不准回头看.去过自己另外的生活.你要听话,不是所有的鱼都会生活在同一片海里. ...

  7. Telnet IMAP Commands Note

    http://busylog.net/telnet-imap-commands-note/  Telnet IMAP Commands Note https://www.cnblogs.com/qiu ...

  8. 常用的数据整理的JavaScript库

    Lodash.js https://lodash.com/ Underscore.js https://www.html.cn/doc/underscore/

  9. Artech的MVC4框架学习——第六章Model的验证

    第一Model验证旨在为通过Model绑定生成参数进行检验以确保用户输入数据的有效性(p318) 第二Model验证分两种:服务器端(三种解决方案 p256)和客户端(ajax\jQuery) 第三服 ...

  10. Jquery操作select选项集合,判断集合中是否存在option

    转载:http://www.cnblogs.com/pepcod/archive/2012/07/03/JavaScript.html Query获取Select选择的Text和Value: 语法解释 ...