1.

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

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

<label> 标签的 for 属性应当与相关元素的 id 属性相同。

"for" 属性可把 label 绑定到另外一个元素。请把 "for" 属性的值设置为相关元素的 id 属性的值。

label的基本使用方法:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<label>用户名:</label>
<input type="text" name="user"/>
</body>
</html>

运行结果:

2. 通过for获取了光标,与input关联上。点击文字,使得关联的文字获取光标。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<label for="username">用户名:</label>
<input id="username" type="text"/>
</body>
</html>

运行结果:

2. fieldset的用法:<fieldset> 标签会在相关表单元素周围绘制边框。

<legend>login</legend>: 作用就是画了一个框

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<label for="username">用户名:</label>
<input id="username" type="text" name="user"/>
<fieldset>
<legend>login</legend>
<label for="username">用户名:</label>
<input id="username" type="text" name="user"/ >
<br/>
<label for="pwd">密码:</label>
<input id="pwd" type="text" name="pwd"/ >
</fieldset>
</body>
</html>

运行结果:

html的body内标签之label标签和fieldset标签的更多相关文章

  1. 列表框、分组列表框、标签(label)、分组框(fieldset)、框架(frameset)

    列表框(select) 下拉列表,用户可以从一些可选项中选择. 示例:简单的下拉列表 <select name="country"> <option value= ...

  2. 1. HTML <fieldset> 标签

    定义和用法 fieldset 元素可将表单内的相关元素分组. <fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段. 当一组表单元素放到 <fieldset> ...

  3. 8、html的body内标签之fieldset标签和label标签

    一.label标签 <label> 标签为 input 元素定义标签(label). label 元素不会向用户呈现任何特殊的样式.不过,它为鼠标用户改善了可用性,因为如果用户点击 lab ...

  4. Chapter 5. Label and Entry Widgets 标签和输入部件

    Chapter 5. Label and Entry Widgets  标签和输入部件 有时候,你需要用户输入特定的信息,比如他们的名字,地址或者 甚至序号. 简单的方式来实现这个是使用Enry 部件 ...

  5. python 之 前端开发(form标签、单选框、多选框、file上传文件、按钮、label标签、下拉列表、textarea标签、fieldset标签、table标签)

    11.25 form标签 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  6. HTML <fieldset> 标签将表单内的相关元素分组

    <fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段. 当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边 ...

  7. Cocos2d-x 3.0标签类Label

    Cocos2d-x 3.0后推出了新的标签类Label,这种标签通过使用FreeType[1]来使它在不同的平台上有相同的视觉效果.由于使用更快的缓存代理,它的渲染也将更加快速.Label提供了描边和 ...

  8. 小tips:JS语法之标签(label)

    JavaScript语言允许,语句的前面有标签(label),相当于定位符,用于跳转到程序的任意位置,标签的格式如下. label: statement 标签可以是任意的标识符,但是不能是保留字,语句 ...

  9. Label Propagation Algorithm LPA 标签传播算法解析及matlab代码实现

    转载请注明出处:http://www.cnblogs.com/bethansy/p/6953625.html LPA算法的思路: 首先每个节点有一个自己特有的标签,节点会选择自己邻居中出现次数最多的标 ...

随机推荐

  1. 成都Uber优步司机奖励政策(4月6日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  2. bbblack的网络socket通信实验

    1. 本次用bbblack作网络的通信实验,对了,这个板子必须装SD卡才能启动吗?板载的4GB eMMC Flash 存储器,eMMC (Embedded Multi Media Card) 为MMC ...

  3. hdu1045Fire Net(经典dfs)

    Fire Net Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Su ...

  4. spring入门(Ioc的理解)

    spring对依赖的注入理解可以参考这篇:https://www.cnblogs.com/alltime/p/6729295.html 依赖注入和控制反转 传统的JavaEE程序中,直接在内部new一 ...

  5. leetcode-生成括号(回溯算法)

     转载出处:https://blog.csdn.net/yanerhao/article/details/68561290 生成括号     给出 n 代表生成括号的对数,请你写出一个函数,使其能够生 ...

  6. 垃圾收集器与内存分配策略(深入理解Java虚拟机)

    3.1 概述 垃圾收集器要解决哪些问题? 哪些内存需要回收 什么时候回收 如何回收 引用计数算法:当有一个地方引用,+1,引用失效,-1.     缺点:对象之间相互循环引用的问题. 可达性分析算法: ...

  7. 【json提取器】- 提取数据的方法

    json 提取器的使用 方法 json 提取器  提取的结果   我用调试取样器进行查看

  8. python3-声音处理

    先来说下二进制读写文件,这需要struct库 #二进制文件读写 import struct a= b=- # print(struct.pack("h",b)) # print(s ...

  9. Java中二进制数与整型之间的转换

    import java.io.*; public class Test{ /** * 二进制与整型之间的转换 * @param args * @throws IOException */ public ...

  10. 【第一章】MySQL数据概述

    安装部署 备份恢复主备复制读写分离HA架构分布式数据库压力测试性能优化自动化运维 ==数据的存储方式1. 人工管理阶段2. 文件系统阶段3. 数据库系统管理阶段 ==数据库技术构成1. 数据库系统 D ...