HTML title 属性

2023-11-02

先总结:除非在特殊情况下,否则不要使用 title 属性。

HTML title 全局属性包含表示与其所属元素相关的建议信息的文本。也就是指定元素的提示文本。

title 是鼠标放在图片上面时显示的文字,

当鼠标移动到带有 title 属性的元素上时,提示文本将作为工具提示(tooltip)显示出来。可以说,title 是对该元素的描述和进一步的说明。

但在一些情况下,它可能是不必要的。

我们都知道,title 属性通常被用于可访问性和 SEO 的优化。但对于屏幕阅读器用户来说,title 属性中包含的内容通常是不必要的、多余的,甚至可能没有使用。在大多数情况下,放置在 title 属性中的内容对(可能的)大多数用户是隐藏的。如果信息对大多数用户都是隐藏的,那么可能就没有存在的必要了。

以下是常见适合使用 title 属性的情况:

  • 对于 <frame><iframe> 元素

  • 用于在文本标签多余时提供标签

如果想要在 <img> 标签上使用 title,请保持与 alt 相同的值。

根据文本替代计算的预期行为,计算文本替代的优先级应该是:

  • aria-labelledby —— 该属性用来表明某些元素的 id 是某一对象的标签。

  • aria-label —— 该属性用来给当前元素加上的标签描述,接受字符串作为参数。

  • alt

  • title

在使用上述两种或两种以上的情况下,列表中最高的就成为所使用的。考虑以下示例:

<img src="logo.png" alt="" title="logo" />

在这种情况下,alt 实际上成为了首要方案,因为它的优先级更高。因此,即使 title 拥有有用的内容,它也不会被使用,因为 alt 在那里。

对于一个普遍可靠的文本替代图像,alt 属性应该是首选方法。在提供 title 属性的情况下,它应该与 alt 具有相同的值。

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

HTML title 属性 的相关文章

  • 为什么 (Oracle) JVM 对内存使用有固定上限 (-Xmx)?

    本着提问的精神Java 为什么存在 MaxPermSize https stackoverflow com questions 3356005 java why does maxpermsize exist 我想问一下为什么Oracle J
  • 识别包含本机方法实现的库文件/源

    如何识别包含本机方法实现的库文件 Ex public native String intern 我在哪里可以找到实施 source code of String intern 方法 找到了答案String intern 与快速谷歌搜索 ht
  • 如何更新 Websphere 7 以使用 EL2.2?

    这就是我所做的 按照此林肯 巴克斯特的帖子 http ocpsoft com java jsf2 java jsf2 how to add the magic of el el2 to jsf 我下载了 el api 2 2 jar 和 e
  • Lighthouse 多个 URL

    我需要对一个网站进行全面审核 但我想知道是否有任何方法可以让 Lighthouse 做到这一点 我知道他们不支持完整的站点审核或多个 URL 但我发现可以使用 bash 脚本来完成 因此 我将不胜感激对此案的任何帮助 或者您可能会推荐任何灯
  • JRuby调用了错误的方法

    我在调用 Java 方法时遇到了一个奇怪的问题JRuby http en wikipedia org wiki JRuby 在我的 Java 类中 这些方法定义了两次 看来 JRuby 调用了错误的方法 所以我尝试使用java method
  • 如何使用 GWT 创建可点击的链接?

    我想与 GWT 建立一些可点击的链接 我不确定这是否是最佳实践 基本上我想要类似这样的东西 如果我用 html 编写的话 a href index html alt Link a Use a 超级链接 http google web too
  • Selenium - WebDriver.findElement() 和 WebElement.findElement() 之间的区别

    我正在使用WebElement findElement By cssSelector click 在页面上查找某个元素 但它返回了 Unable to locate element 但是当我使用WebDriver findElement B
  • 过滤数据表中的行

    我目前的 JQuery 插件 DataTables 工作正常 并且我在页面顶部插入了一个按钮来进一步过滤列表 我还使用了 DataTables 内置的搜索栏 我希望按钮向下过滤表格 并只显示包含特定值的行 下面是我一直在做的事情 但似乎没有
  • 在 JavaScript/CoffeeScript 中确定一个数组是否包含另一个数组的内容

    在 JavaScript 中 如何测试一个数组是否包含另一个数组的元素 arr1 1 2 3 4 5 8 1 10 2 3 4 5 9 function name arr1 gt true 没有 set 函数可以执行此操作 但您可以简单地执
  • 将带有 rowspan 和 colspan 的 XHTML 表转换为 LaTeX

    我一直在寻找将 HTML 表格转换为 LaTeX 的合适解决方案 我发现以下问题与我的要求相似 XML 表到 LaTeX https stackoverflow com questions 27021926 xml table to lat
  • 汇总异常以保留模块

    我使用一个名为的汇总插件rollup plugin lit css转变 css文件转换成 javascript 模块 该插件非常简单 它本质上只是附加export default到文件 我的汇总配置使用preserveModules and
  • 在java中访问dll方法

    我正在尝试访问java中用c 编写的dll方法 从下面的代码我试图构建已成功生成的 dll using System using Microsoft Win32 namespace CyberoamWinHelper public clas
  • Javascript - 通过键获取特定 JSON 数组元素内的属性值

    我有一个像这样的 JSON 结构 map key1 valueA1 key2 valueA2 key3 valueA3 key1 valueB1 key2 valueB2 key3 valueB3 key1 valueC1 key2 val
  • 将json数据从servlet传递到jsp到js文件

    我得到了这个创建 JSON 数据的 servlet 我想将此数据传递到一个 jsp 页面 该页面应该通过 InfoVis 工具包显示数据 servlet java JSONObject json new JSONObject JSONArr
  • 如何在网页上显示进度条直到网页完全加载?

    我想在网页中显示进度条 加载弹出窗口 直到页面完全加载 我的网页很重 因为它包含一个 HTML 编辑器 这是一个基于 jQuery 的 HTML 编辑器 需要很多时间才能完全加载 在加载时 我希望在页面上显示一个进度条 该进度条将在整个页面
  • 如何将国家/地区代码与电话号码分开?

    我的数据库中有很多电话号码 例如 1 123 456 7890 我要做的是将国家 地区拨号代码 在本例中为美国 加拿大的 1 与电话号码分开 我尝试创建所有国家 地区的 JSON 列表 并在加载页面时将电话号码和国家 地区代码分开 它工作正
  • 在 Ubuntu 上的 Tomcat 中加载共享本机库

    如何在 Ubuntu 上的 Tomcat6 中加载共享库 我创建了一个名为 libawragrids so 的库 awragrids 并将其放置在 var lib tomcat6 shared 我在调用启动 tomcat 的终端中设置了以下
  • ASP.NET MVC3 Ajax.ActionLink - 条件确认对话框

    我有一个 Ajax ActionLink 仅当满足某些条件 用户有未保存的更改 时 我才希望显示一个确认对话框 我创建了一个 JavaScript 函数 它根据需要显示确认对话框 并根据响应返回 true 或 false 我将其绑定到 Ac
  • GridLayout 中的 JLabel

    如何添加JLabel出于GridLayout 我有一个 8x8 网格布局 Container content getContentPane content setLayout new GridLayout 8 8 2 2 for int f
  • java中的“main”可以返回字符串吗?

    java中的public static void main String args 是否有可能返回String代替void 如果是 怎么办 public static String main String args 代替 public st

随机推荐

  • 微前端总结

    微前端 核心价值 微前端架构具备以下几个核心价值 技术栈无关 主框架不限制接入应用的技术栈 微应用具备完全自主权 独立开发 独立部署 微应用仓库独立 前后端可独立开发 部署完成后主框架自动完成同步更新 增量升级 在面对各种复杂场景时 我们通
  • 限流-漏桶算法、令牌桶算法

    1 问题 系统的某个接口访问量突然激增 没多久接口崩溃 形成连锁反应 导致整个系统崩溃 如何应对这种情况呢 为我们的接口加上 保险丝 预防这种突发情况 接口压力过大 造成整个系统瘫痪 当接口流量过大时 我们可以通过拒绝访问或等待等机制 即限
  • 【Python 基础篇】Python中的 __name__ == ‘__main__’ 详解

    学习过C语言或者Java语言的盆友应该都知道程序运行必然有主程序入口main函数 而python却不同 即便没有主程序入口 程序一样可以自上而下对代码块依次运行 然后python不少开源项目或者模块中依然存在 name main 这种写法
  • avalonjs 中的if else实现的几种方法

    在学习avalonjs的过程中 发现模板中并没有if else这样的写法 不像tempalte ejs这些 所以总结了三种方法来实现 仅供在使用avalonjs的同学参考 主要是通过ms if 表达式和方法来实现 1 开始前的准备 首先是做
  • SparkSQL DSL 语法

    SparkSQL DSL 语法 DataFrame 提供一个特定领域语言 domain specific language DSL 去管理结构化的数据 可以在 Scala Java Python 和 R 中使用 DSL 使用 DSL 语法风
  • 模型解释性:PFI、PDP、ICE等包的用法

    本篇主要介绍几种其他较常用的模型解释性方法 1 Permutation Feature Importance PFI 1 1 算法原理 置换特征重要性 Permutation Feature Importance 的概念很简单 其衡量特征重
  • Linux下使用TCP协议完成一个简单的client-service通信

    最近学习了网络编程 简单分享一下自己学习的内容 TCP协议简介 TCP向应用层提供了一个可靠的 有序的 面向连接的 基于字节流的全双工的通信协议 它能提供高可靠性通信 即数据无误 数据无丢失 数据无失序 数据无重复 三次握手协议 TCP是面
  • 详解Java中的Base64原理跟用法

    简介 Base64编码 是我们程序开发中经常使用到的编码方法 它是一种基于用64个可打印字符来表示二进制数据的表示方法 它通常用作存储 传输一些二进制数据编码方法 也是MIME 多用途互联网邮件扩展 主要用作电子邮件标准 中一种可打印字符表
  • Qt源码重新编译QtMultimedia模块解决XP播放视频问题

    当用qml的MediaPlayer在XP系统下播放视频时 会报错 QtMultimedia defaultServiceProvider requestService no service found for org qt project
  • Mac和Linux远程连接服务器异常修复(WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!)

    一 今天在使用SSH 连接远程服务器的时候 刚开始是没问题的 后来阿里云主机重装了一下系统后 再也连不上了 一直报一个错 22 49 52 ssh root 47 98 233 15 WARNING REMOTE HOST IDENTIFI
  • centos 7.3 快速安装ceph

    Ceph简介 Ceph是一种为优秀的性能 可靠性和可扩展性而设计的统一的 分布式文件系统 部署逻辑架构 准备3台主机 并且修改主机名 hostnamectl set hostname xxx 后重启 IP地址 主机名 Hostname 19
  • Django模板使用ajax实现注册功能

    写一个很简单的注册功能的页面 一开始我是用form表单写的 写完之后 体验效果极差啊 每次刷新都会把数据提交到后台 这就导致我输入一条数据并点了提交 然后在这个页面刷新n次 就保存到数据库n次 具体原因不详 百度的时候据说是因为返回的时候还
  • public class的类名必须跟文件名保持一致吗?

    转载于 https www cnblogs com zxfei p 10685606 html
  • 660 39

    题干 初次解题思路 将原式中的x替换为t 原式和微分中的x都要代换 最后只保留y和t作为答案 关键在一阶 二阶导数这里 1 引入了第三个变量t 所以理解为参数方程求导 x y均为由t表示的函数 y 和y 可以作为最后结果出现在结果当中 2
  • discuz导入mysql_Discuz 导入mysql 出现#1062 - Duplicate entry '1' for key 'PRIMARY'

    展开全部 当mysql出现 ERROR 1062 错误时 查看字段的e68a843231313335323631343130323136353331333365643662属性是否合理 不合理 则修改该字段的属性 合理 则进行表的恢复 如下
  • MATLAB简单图形绘制(五)

    目录 实验目的 实验内容 实验目的 1 掌握MATLAB图形绘制的基本原理和方法 2 熟悉和了解MATLAB图形绘制程序编辑的基本指令 3 掌握利用MATLAB图形编辑窗口编辑和修改图形界面 并添加图形的各种标注 4 掌握plot subp
  • 常见中间件——Tomcat漏洞复现分析

    文章目录 Tomcat 任意文件写入 CVE 2017 12615 漏洞本质 原因 jsp木马 绕过方式 修复建议 Tomcat 远程代码执行 CVE 2019 0232 漏洞本质 修复建议 Tomcat 文件包含漏洞 CVE 2020 1
  • 2019/8/13面试内容

    1 基本数据类型 5种 boolean string number undefined object 对象 null 2 闭包原理 优缺点 3 变量回收机制 4 如何判断ie浏览器 5 有没有尝试自己封装ajax 写出原生ajax 6 re
  • 【1.PyQt5 GUI 软件开发框架】5.QtCreator帮助信息的使用

    5 QtCreator帮助信息的使用 5 1QtCreator帮助信息 在安装PyQt5时不会安装类库帮助文档 当然 可以使用PyQt5的在线帮助文档 但并不是完整的 所以 可以在QtCreator中使用帮助文档 帮助文档中包括类的属性 定
  • HTML title 属性

    先总结 除非在特殊情况下 否则不要使用 title 属性 HTML title 全局属性包含表示与其所属元素相关的建议信息的文本 也就是指定元素的提示文本 title 是鼠标放在图片上面时显示的文字 当鼠标移动到带有 title 属性的元素