小伙伴们,你们在前面学习表单各种控件的时候,有没有发现一个标签--label,这一小节就来揭晓它的作用。

label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。

语法:

<label for="控件id名称">

注意:标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。

例子:

<form>
<label for="male">男</label>
<input type="radio" name="sex" id="male" />
<br />
<label for="female">女</label>
<input type="radio" name="sex" id="female" />
<label for="email">输入你的邮箱地址</label>
<input type="email" id="email" placeholder="Enter email">
</form> 练习:

												

HTML--form表单中的label标签的更多相关文章

  1. 在学习HTML——form表单中的label标签时的一点小体会

    在我啃了一遍书本之后,开始了在慕课看视频的过程,从最开始的HTML+CSS的基础课程看起,在第5-9小节讲到了form表单的label标签, 首先看一下慕课的讲解:  label 标签不会向用户呈现任 ...

  2. form表单中的label标签

    小伙伴们,你们在前面学习表单各种控件的时候,有没有发现一个标签--label,这一小节就来揭晓它的作用. label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性.如果你在 labe ...

  3. form表单中使用a标签代替button或commit进行数据提交

    1.申明form的id:xxx 2.在<a>标签内书添加属性 onclick="document:xxx.submit()" ​

  4. Unieap3.5-禁用Form表单中的全部标签

    var form=unieap.byId('customerForm'); var children=form.getDescendants(); dojo.forEach(children,func ...

  5. jsp中的form表单中的 id和name有什么区别了

    <form action="./system/WebServer_webServerLogin" method="post" id="login ...

  6. Form表单中method为get和post的区别

    序,form表单中的方法分为get和post,但你都知道他们之间的区别吗? Form表单中method为get和post的区别: 例子如下,有个Form表单. <form action=&quo ...

  7. 今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式

    今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式 jquery中的serialize() 方法 该方法通过序列化表单值,创建 URL 编码文本字符串 序列化的值可在 ...

  8. jQuery中设置form表单中action值的方法

    jQuery中设置form表单中action值的方法 (2011-03-17 10:18:19) 转载▼ 标签: 杂谈   html代码: <form id="myFormId&quo ...

  9. form表单中button按钮返回上一页解决办法

    解决Form中button按钮不好用的问题解决办法. 方法一: 1.在Form表单标签中国增加一个属性,如下图,红框处 2.返回按钮样式 3.onclick方法需要跳转的页面,遮挡处为需要返回的页面 ...

随机推荐

  1. java基数排序

    代码如下: import java.util.Arrays; public class MultiKeyRadixSort { public static void radixSort(int [] ...

  2. 框架之---Flask

    Flask是一个轻量级的WEB框架,它和Django相比,就是一个胖子和一个骨架的区别. Flask是一个py文件就可以run的web框架,但是就因为是py文件就能run,所有,啥都没有,等把Flas ...

  3. [bzoj3106][cqoi2013][棋盘游戏] (对抗搜索+博弈论)

    Description 一个n*n(n>=2)棋盘上有黑白棋子各一枚.游戏者A和B轮流移动棋子,A先走. l         A的移动规则:只能移动白棋子.可以往上下左右四个方向之一移动一格. ...

  4. Codeforces Round #506 (Div. 3)B.Creating the Contest(dp)

    B. Creating the Contest time limit per test 1 second memory limit per test 256 megabytes input stand ...

  5. [Codeforces 876]比赛记录

    上场$rating$果然炸飞,但是据说这次只要不$FST$就能翻回来QWQ? T1  $dfs$乱搞? T2  取模乱搞,$STL$ $vector$大法好(%%%$ryf$秒出做法) T3  看了半 ...

  6. reids桌面管理工具:RedisDesktopManager下载、使用

    概要:一款好用的Redis桌面管理工具,支持命令控制台操作,以及常用,查询key,rename,delete等操作. 下载软件,请点击下面链接,进入下载页,选择对应版本: https://redisd ...

  7. 救命(洛谷 U4525)

    题目背景 XS中学的校长积劳成疾,最终由于无聊而卧病在沙发.需要药(pi)水(gu)拯救他的生活. 题目描述 现在有n种药水,编号分别为1..n,能拯救校长的药水编号为n 每个药水都可以购买到,但有的 ...

  8. docker: 解决centos7下cgroup.procs: no such device的错误

    在centos7下,运行docker run的时候会发生cgroup.procs: no such device的错误,解决方法是编辑 /lib/systemd/system/docker.servi ...

  9. ArcSDE Redhat Linux下双机热备部署文档

    http://www.gisall.com/html/47/122747-3867.html ArcSDE系统环境: 操作系统:Red Hat Enterprise Linux AS/ES 5.5 ( ...

  10. LintCode-分糖果

    有 N 个小孩站成一列.每一个小孩有一个评级. 依照下面要求.给小孩分糖果: 每一个小孩至少得到一颗糖果. 评级越高的小孩能够得到很多其它的糖果. 需最少准备多少糖果? 您在真实的面试中是否遇到过这个 ...