将 label 标签包裹在表单项周围还是使用 HTML 中的“for”属性更好?

2024-01-11

我知道您可以同时使用两者,但是使用其中一个比使用另一个更好吗?如果是这样,为什么?

“for”属性的示例:

<input type="text" id="male"><label for="male">Male</label>

包裹示例:

<label>Age:<input type="text"></label>

从语义上讲,两种可能性是相同的。但根据您想要的布局,这两种可能性各有优点和缺点。例如,如果您希望标签位于完全不同的位置,则将输入放入标签中是没有任何意义的。但如果你想通过 css 制作悬停效果,那就设置 e。 G。标签和输入周围区域的背景,最好将输入放入标签中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将 label 标签包裹在表单项周围还是使用 HTML 中的“for”属性更好? 的相关文章

  • 如何用Python抓取动态网页

    我正在努力做什么 抓取下面的网页以获取二手车数据 Issue 刮掉整个页面 在上面的 url 中 仅显示前 30 项 这些可以通过我在下面编写的代码来抓取 其他页面的链接显示为 1 2 3 但链接地址似乎是用 Javascript 编写的
  • 用不同的颜色为 Google 热图着色

    我试图开发一个遵循 Google Map API 的热度 https developers google com maps documentation javascript examples layer heatmap https deve
  • 在导航栏下方添加背景图片

    我想在导航栏下方添加背景图像 具有完整窗口大小的宽度 它不应覆盖整个页面长度 而是从导航栏菜单下方开始 一直向下直到特定的指定高度 但宽度是满的 我参考了以下内容 但仍然没有结果 在 Twitter Bootstrap 中的导航栏下方启动背
  • 使用JQuery检查元素是否有边框?

    所以我正在玩 el css 尝试确定元素是否有边框 我用 css border style solid 设置边框 这是可行的 但实际上它设置了 4 种单独的样式 border right style border left style bo
  • 使用php表单更改href链接

    我正在制作一个带有搜索栏的网站 我想让搜索栏在 搜索 并显示结果后具有交互性 所以我希望 href 根据正在使用的 Id 进行更改 例如 有人搜索 Pinecones 如果它在数据库中 它将有一个 ID 在本例中是 4 一旦他们搜索它 它就
  • 显示表中的记录

    我的第一个 PHP 项目遇到了一些麻烦 我试图从 MySQL 数据库 有 3 条记录 获取数据并将其显示在表格中 问题是它似乎只显示记录 2 和 3 它跳过了第 1 条记录 请参阅我的代码并在下面显示 if mysqli connect e
  • 使用本机 JavaScript 获取过渡中的 CSS 值

    这个问题之前被问过 但答案使用了 jQuery here https stackoverflow com q 8920934 3186555 因此 我将调整问题以专门询问native解决方案 to 最小化依赖关系 假设您有一个 div 然后
  • div Hello div div Howdy dere pardner div div div 我明白它的作用 但为什么叫这个名字both 什么是both mean 两者的意思是 一组两件事中的每一项 左 和 右 两件事
  • 为什么我不能在 TCPDF 表中使用 č,ć,đ 图表?

    我正在为我的网站构建一个 tcpdf 文件 该 tcpdf 文件中有一个包含一些数据的表格 但我无法使该章程正常工作 对于编码 我使用 windows 1250 宪章女巫不起作用 我已经尝试过 utf 8 但仍然没有得到这个章程 tcpdf
  • 将 div 文本分配给变量然后显示它

    我有一个简单的任务 我试图完成学习 JavaScript 但一直无法找到明确的答案 这是代码 div Testing div 基本上我希望将方框 div 中的文本存储到变量中 然后 我想在页面的不同部分显示该变量的文本 使用上面的代码我得到
  • 为什么我的图像下方有空间? [复制]

    这个问题在这里已经有答案了 图像在下面获得了神秘的空白空间 即使padding 0 margin 0被应用 示范 http jsfiddle net cLETP 红色边框应该包围图像 但底部有空间 造成这种情况的原因是什么 如何删除该空间
  • 是否可以使“HTML 到语音”与“文本到语音”相同?

    我有一个奇怪的要求 在我现有的应用程序中我有Text2Speech为此 我使用了AVSpeechSynthesizer 到语音文本 但现在要求发生了变化 现在我需要将 HTML 文件数据转换为文本 例如HTML2Speech 我们可以想到的
  • 从顶部开始在同一水平线上显示同一行中的两个 div

    这是我的代码 floating box display inline block width 150px margin 10px border 3px solid 73AD21 after box border 3px solid red
  • 每 2 行后使 html 表格的边框变厚

    我创建了一个包含一些内容的表 其中有 12 行和 2 列 我想显示边框 但每 4 行之后 我想将水平边框设置为比正常情况更粗 怎么做 请在这里帮忙 试试这个选择器 table tr nth of type 4n td border bott
  • 古老的“字幕”标签的替代品?

    marquee 标签的标准等效项是什么 我正在寻找 HTML C asp NET 或 ASPX jquery java 脚本的解决方案 marquee 标签未包含在标准中 因为它是 视觉 标签 而不是 语义 标签 因此 您想要的任何语言都没
  • 链接无效

    我正在尝试使用以下命令创建一组指向页面中特定部分的链接 a href 符号 但它似乎不起作用 点击链接似乎没有任何反应right click gt open in a new tab更改 url 但不会移动到页面的其他部分 我使用的是火狐浏
  • 使用 python 在一个 html 页面中显示分割数据框的 HTML 代码

    我是 html css 新手 所以对以 html 格式显示的数据有疑问 我有一个很长的列表 我想将其拆分并以 html 格式显示为两个单独的列 例如 而不是 Col1 Col2 1 a 2 a 3 a 4 a 5 b 6 b 7 b 8 b
  • 两列表:一列尽可能小,另一列占据其余部分

    我在 div 中有一个 to columns 表 div table tbody tr td class action a a td td class content p Bigger text variable size p td tr
  • 如何使用 Scrapy 从网站获取所有纯文本?

    我希望在 HTML 呈现后 可以从网站上看到所有文本 我正在使用 Scrapy 框架使用 Python 工作 和xpath body text 我能够获取它 但是带有 HTML 标签 而且我只想要文本 有什么解决办法吗 最简单的选择是ext
  • 使用 CSS 折叠和展开元素

    我正在尝试构建一个页面 加载时仅可见标题 并且 当用户单击标题时 每个标题下方的表格会在隐藏和显示状态之间切换 我的限制是只能在 CSS 中执行此操作 这是我到目前为止想到的 https jsfiddle net Argoron c1ypx

随机推荐

  • iPhone 开发者的 IRC 频道? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我想知道是否有一个好的 IRC 频道可以让 iPhone 开发人员聚在一起讨论代码等 人们已经在使用任何
  • 如何在Excel VBA中进行多重转置

    我有一个分散的项目列表 我需要将它们全部放在一列中 分散的项目可以放入空白单元格内的一列中 这是我的要求 第一列中的值不得更改位置 我有一个进行转置的代码 但它改变了第一列中值的位置 将所有内容放在一起 因此粉色的位置 第 9 个 变为第
  • Rails:保存后验证关联?

    我有一个User模型有很多roles 角色包含一个user id领域 我想要validate presence of 问题是 如果我在创建时为用户分配角色 验证将失败 因为未设置 user id 现在我do想要验证 user id 是否存在
  • 连接两个具有不同数据的相同表结构

    Edit After attempting the COALESCE method I m now seeing an issue where the data is repeating itself with the same data
  • 为 Ubuntu 中的现有文件创建新的 BitBucket 存储库

    我有一些文件想要添加到 BitBucket 上的新存储库中 如何使用 Ubuntu 命令行执行此操作 另一种方法是首先从 BitBucket 网站创建存储库 但我不知道如何将存储库克隆到非空目录中 更多详细信息布鲁斯的评论 https st
  • MySQL 查询当前周的yearweek 从周四开始,周三结束

    我有一个SQL设置语句以获取当前日历周的数据 默认情况下 这会抓取从周日开始到周六结束的数据 我希望改变这一点 以便日历周的开始是星期四 星期三结束 以下是我的发言 SELECT FROM transactions WHERE yearwe
  • 使用 mongo java 驱动程序执行查找时 Cosmos Db 回复消息长度错误

    使用 Mongo Java 驱动程序版本 3 4 2 尝试对包含大约 700 个文档的集合执行查找查询已开始引发以下异常 当集合较小时 这种情况不会发生 这些限制看起来是在连接过程中设置的 com mongodb MongoInternal
  • 聚合物服务和服务人员

    我正在尝试开始调试我的聚合物应用程序 我通过复制我的想法手工制作了它PolymerCLI Polymer init does 我不确定正在加载服务人员的是什么 开发的默认选项只做了一个console info 打电话说它已被禁用以进行开发
  • 在 R 中查找给定数据的“行方式”“众数”[重复]

    这个问题在这里已经有答案了 Unlike rowMeans and rowMedians 这给了我们计算出来的数字 mode x 给出数据的存储模式 我的问题 对于以下数据框 我如何计算row wise Mode Data Item A B
  • 如何在 OS X 上监视文件更改?

    我希望收到有关写入给定文件的通知 无需轮询 无需从文件中读取 也无需监视父目录并查看文件修改时间戳 我怎么做 我找不到一个简单的例子 所以我贡献我的想法以供将来参考 interface FileWatch property assign d
  • Delphi 中的 DataModule (dm) 是什么?

    在您的项目中使用 DataModule 的目的是什么 与普通的类或模块相比 它有什么特殊的属性吗 它通常用于什么约定 数据模块是一种非可视 表单 容器 可以包含非可视组件 通常是数据库组件 尽管可以添加任何组件 例如对话框和Indy htt
  • 数组初始化C

    这个初始化的意义是什么 char arr 10 0 我熟悉char arr 10 0 它将所有元素设置为零 并且char arr 10 1 2 它将前两个元素设置为 1 和 2 ascii 其余元素设置为 0 我对上面的格式不熟悉 快速测试
  • 将元组转换为 proplist

    如何从 MongoDB 转换元组 id lt lt vasya gt gt password lt lt 12ghd gt gt age undefined 到支柱列表 id lt lt vasya gt gt password lt lt
  • 为什么当我运行此测试时,这个 sinon 间谍没有被调用?

    我有一个骨干模型 class DateTimeSelector extends Backbone Model initialize gt bind change date updateDatetime bind change time up
  • 在 ASP.NET 中下载文件而不弹出窗口

    我正在使用代码下载文件 btnDownloadTemplate Attributes Add onClick window open StudyReport WordReportTemplate doc OpenTemplate resiz
  • 使用 selenium 在 Chrome 中“未知错误:无法读取 null 的属性‘scrollleft’”

    在 Chrome 中 当我单击按钮时 出现 未知错误 cannot read property scrollleft of null 他们是该页面中的 1 个输入字段 我可以输入值 因为只有按钮单击不起作用 此点击在 Firefox 中运行
  • 使用从 Azure AD 和 ADAL 获取的令牌访问本地 SharePoint

    The Goal 使用 OAuth 从基于 Apache Cordova 的移动应用程序通过 REST 请求访问本地 SharePoint 数据 到目前为止我已经尝试过的 1 Azure 移动服务 混合连接 AAD ADAL 与博文类似代表
  • Qt 中的测试用例在哪里?

    我已经阅读了 Qtestlib 手册和教程 并逐步了解了开发测试的过程 如果我是对的 Qt 已经开发了一些测试用例来测试其功能 谁能告诉我Qt源代码树中这些代码在哪里 如果我必须修改它们 测试用例 我可以这样做吗 提前致谢 尼夫 单元测试不
  • 使用 Hilt 注入 CoroutineWorker:无法实例化woker

    有人问过同样的问题 但它们对我不起作用 一开始我使用的是最新版本的工作管理器 即 2 7 alpha 3 但我降级了 因为它只兼容 android 12 预览版 sdk 错误仍然存 在 它无法实例化工作人员 因为这些依赖项包含在工作人员的构
  • 将 label 标签包裹在表单项周围还是使用 HTML 中的“for”属性更好?

    我知道您可以同时使用两者 但是使用其中一个比使用另一个更好吗 如果是这样 为什么 for 属性的示例