label标签的作用
在用户注册的时候，常常用户点击文字就需要将光标聚焦到对应的表单上面，这个是怎么实现的呢？就是下面我要介绍的<label>标签的for属性
定义：for 属性规定 label 与哪个表单元素绑定
如：
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>label标签的用法</title>
</head>
<body>
<table>
<tr>
<td><label for="username">用户名：</label></td>
<td><input type="text" name="username" id="username"></td>
</tr>
<tr>
<td><label for="password">密码：</label></td>
<td><input type="password" name="password" id="password"></td>
</tr>
<tr>
<td><label for="repassword">密码确认：</label></td>
<td><input type="password" name="repassword" id="repassword"></td>
</tr>
<tr>
<td><label for="_basketball">爱好：</label></td>
<td>
<label><input type="checkbox" value="basketball" name="hobby" id="_basketball">basketball</label>
<label><input type="checkbox" value="football" name="hobby" id="_football">football</label>
<label><input type="checkbox" value="skating" name="hobby" id="_skating">skating</label>
<label><input type="checkbox" value="dance" name="hobby" id="_dance">dance</label>
</td>
</tr>
<tr>
<td><label for="_boy">性别：</label></td>
<td>
<label><input type="radio" value="boy" name="sex" id="_boy">boy</label>
<label><input type="radio" value="girl" name="sex">girl</label>
</td>
</tr>
<tr>
<td><label for="email">邮箱：<label></td>
<td><input type="text" name="email" id="email"></td>
</tr>
<tr>
<td><label for="address">住址：</label></td>
<td><input type="text" name="address" id="address"></td>
</tr>
</table>
</body>
</html>
label标签的作用的更多相关文章
- 关于label标签的作用
label标签的定义和用法: <label> 标签为 input 元素定义标注(标记). label 元素不会向用户呈现任何特殊效果.不过,它为鼠标用户改进了可用性.如果您在 label ...
- react中label标签的作用
当我们点击输入内容触发input焦点的时候,就需要使用到label标签里的htmlFor属性来扩大点击的区域 代码如下:
- 转：label标签的特殊用法
容易被忽略的label标签 原始作用 label标签是HTML原生的标签,其原始的作用参考这里 label 标签为 input 元素定义标注(标记). label 元素不会向用户呈现任何特殊效果.不过 ...
- 容易被忽略的label标签
# 容易被忽略的label标签 ## 原始作用 `label`标签是HTML原生的标签,其原始的作用参考[这里](http://www.w3school.com.cn/tags/tag_label.a ...
- HTML——label标签
最近在做将input[type="file"] 改变其样式时,发现label的巨大潜力,特此记录一下. 1, label标签的作用 (1)为input元素定义标注(标记) (2)不 ...
- [HTML5]label标签使用以及建议
for 属性规定 label 与哪个表单元素绑定. 隐式和显式的联系 标记通常以下面两种方式中的一种来和表单控件相联系:将表单控件作为标记标签的内容,这样的就是隐式形式,或者为 <label&g ...
- a标签中的label在IE下触发不了a标签的href链接（label标签——解析）
<a href="http://www.baidu.com/" target="_blank"> <span>百度</span&g ...
- form表单中的label标签
小伙伴们,你们在前面学习表单各种控件的时候,有没有发现一个标签--label,这一小节就来揭晓它的作用. label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性.如果你在 labe ...
- 第7天：input和label标签
今天学的不多,就只学了表单元素中的input和label标签.搬了房子,收拾了一下东西,太累了,所以没有学很多.明天还上班,今天就先到这. 一.input input标签type属性有以下几个:tex ...
随机推荐
- SharePoint 2010 技术参数（整理）
今天整理一些 SharePoint 2010 的技术参数,其内容都来自 SharePoint-Sandbox 网站. 有些参数值是硬性的,比如列表单条记录的尺寸:而有些是为了使用和性能考虑的推荐值. ...
- centreon-engine 性能调优
http://documentation.centreon.com/docs/centreon-engine/en/latest/user/configuration/best_practice.ht ...
- U深度U盘启动盘制作工具怎么用？U深度U盘启动盘制作工具使用教学
U深度u盘启动盘制作工具是一款强大的启动盘制作软件,对于新手用户来说,由于软件专业度很高,想一下就上手是比较困难的.所以这里给大家分享一篇U深度u盘启动盘制作工具的使用教程. 使用教程: 第一步:安装 ...
- Verilog八线 - 三线优先编码器设计（74LS148）
百度百科_74LS148 if语句法 //8线-3线优先编码器设计(74LS148) // //EI | A7 A6 A5 A4 A3 A2 A1 A0 | Y2 Y1 Y0 GS EO //0 | ...
- Arduino-串口函数Serial
串口是Arduino与其它设备进行通信的接口,我们需要很好的掌握它的使用.Arduino串口使用相关的函数共有10个(随着版本的升级,新版本加入了更多,具体请参见官网:http://www.ardui ...
- IDEA的常用操作（快捷键）
IDEA的常用操作(快捷键) Alt+回车 导入包,自动修正 Ctrl+N 查找类 Ctrl+Shift+N 查找文件 Ctrl+Alt+L 格式化代码 Ctrl+Alt+O 优化导入的类和包 Alt ...
- 楔积(Wedge Procut)
原文链接 由拓扑学中表面(Surface)的定义及实例引入楔积的概念. 基础知识 先看Surface在欧几里得空间内的定义: 所有在Omega中的点w(参数空间中的点)被记作: 对应在R3中(欧几里德 ...
- window环境下安装node.js
在使用sublime text 3 过程中,node.js装了好几次都没有成功,今天终于成功了,现将安装过程整理一下. 安装过程中主要参考了以下代码: 第一,下载文件 https://nodejs.o ...
- Python，针对指定文件类型，过滤空行和注释，统计行数
参考网络上代码编辑而成,无技术含量,可自行定制: 目前亲测有效,若有待完善之处,还望指出! 强调:将此统计py脚本放置项目的根目录下执行即可. 1.遍历文件,递归遍历文件夹中的所有 def getFi ...
- IDEA 安装配置及操作总结(新手必看)
Jetbrains官网下载IDEA15 我们在浏览器输入网址https://www.jetbrains.com/.选择相应的系统版本,下载最新版本的IDEA15,Windows系统双击安装文件,根据界 ...