Alt or title attribute for i tag(i 标签的 Alt 或标题属性)
问题描述
我使用 font-awesome 并像这样显示他们的字体:
I use font-awesome and display their fonts like that:
<i class="icon-lock"></i>
这将显示一个漂亮的小锁符号.为了让用户知道这到底是什么意思,我尝试添加标题和 alt 等属性,但无济于事.
This will display a nice little lock symbol. For the user to know what exactly that means, I tried adding attributes such as title and alt, but to no avail.
我可以为 <i>
标签使用任何属性来执行与图像的 alt 和链接的标题相同的任务吗?
Is there any attribute I can use for the <i>
tag that executes the same task as alt for images and title for links?
推荐答案
您可以在 i
元素上使用 title
属性,就像任何元素一样,例如
You can use the title
attribute on an i
element, like any element, e.g.
<i class="icon-lock" title="This symbolizes your being locked inside"></i>
它是否有帮助是一个更困难的问题.浏览器通常会在鼠标悬停时将 title
属性值显示为工具提示",但为什么用户会将鼠标悬停在图标上?而且这样的工具提示可用性很差;所谓的 CSS 工具提示通常效果更好.
Whether it helps is a more difficult issue. Browsers usually show the title
attribute value as a "tooltip" on mouseover, but why would the user mouse over the icon? And such tooltips are of poor usability; so-called CSS tooltips often work better.
屏幕阅读器可能会授予用户对 title
属性的可选访问权限,但我不确定他们如何处理内容为空的元素.
Screen readers may give the user optional access to title
attributes, but I’m not sure what they do with elements with empty content.
这篇关于i 标签的 Alt 或标题属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:i 标签的 Alt 或标题属性
基础教程推荐
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01