i 标签的 Alt 或标题属性

2022-01-18 00:00:00 tags html font-awesome

我使用 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.

相关文章