Question

我在Ruby on Rails应用程序中使用ActiveScaffold，为了节省表格中的空间，我用图标替换了表格中的默认“操作”文本（即“编辑”，“删除”，“显示”）使用CSS。我还在action_link.add（“move”和“copy”）中添加了一些自定义操作。

为清楚起见，当我将鼠标悬停在图标上时，我希望弹出一个工具提示，其中包含相关操作（即“编辑”，“复制”）。

我想我可以通过在标签上添加一个简单的“alt”定义来实现这一点，但这似乎不起作用。

有人能指出我正确的方向吗？

Answer 1

alt属性将用作图像的替代，如果图像丢失，或用于纯文本浏览器。

当他们将alt显示为工具提示时，IE出错了。它从来就不是那个意思。

这个的正确属性是title，当然不会在IE中提供工具提示。

因此，要在IE和FireFox / Safari / Chrome / Opera中都显示工具提示，请同时使用alt属性和title属性。

Answer 2

添加到此主题只是一个小问题......没有alt标签或标题标签。 alt属性适用于图像，但页面上的所有其他元素都可以具有title属性，这是跨浏览器兼容性的最佳选择。

<span title="Click here to edit the foo">
  Edit
</span>

Answer 3

你想要一个“标题”标签。我不确定这是否有必要，但我通常会添加alt和title标签，以确保所有浏览器都显示相同的工具提示。

Answer 4

HTML中的工具提示是图片代码的alt文字的内容，但如果您使用CSS进行设置，则可能使用background:url(...);样式而不是图片。

Answer 5

在图片上使用alt，在链接上使用title。

Answer 6

img标记的alt属性在某些浏览器中有效，但并非全部（例如某些基于mozilla的浏览器）。

执行此操作的“right way”是使用title属性。

Answer 7

正如Prestaul指出的那样，alt标签应该适用于链接的图像和标题。但是，这也取决于浏览器......大多数浏览器应该实现将此元数据显示为工具提示的功能，但不要求它们这样做。

Answer 8

正如Joel Coehoom指出的那样，我的图标实际上是一个背景图像，我在背景顶部创建了一个带有title和alt属性的transparent.gif图像，并且瞧 - 工具提示！

Answer 9

Answer 10

你可以在你的测试中使用标签 abbr 和 title 属性例如<abbr tittle="some text"> </abbr> 作为那个答案https://stackoverflow.com/a/61601175/9442717