Question

我有以下代码，并希望自定义'title'属性的样式。有没有办法做到这一点。提前谢谢。

<td title="Sample Title">test</td>

Answer 1

不直接。

你可以用：

JavaScript代码：see here
图书馆：see here
使用CSS see here

Answer 2

多年前这可能不可能 - 但现在可以设置Title属性的样式，请参阅here。这应该适用于IE7 +，Safari 3 +，Firefox 2.0+。

可能需要一些自定义样式和定位来适应您自己的设计。

为了确保此链接不会消失，本文中用于设置title属性样式的建议代码为：

<div title="Tooltip text for first div"></div> <div title="Tooltip text for second div"></div>

div:before{ content:attr(title); display:none; }

div:hover::before{ width:200px; display:block; background:yellow; border:1px solid black; padding:8px; margin:25px 0 0 10px; }

div:hover{ z-index:10; position:relative; }

Answer 3

简而言之，您无法设置title属性的样式。它取决于浏览器在显示时如何呈现标题。

但是，jQuery提供了javascript替代方案，可以为您提供所需的解决方案：

http://jquery.bassistance.de/tooltip/demo/

Answer 4

没有。不同的浏览器以不同的方式显示标题工具提示，并且无法使用css对其进行样式设置。如果必须设置样式，则需要寻找替代方法，例如使用jQuery to display custom tooltips。

Answer 5

浏览器支持“title”属性，通常作为工具提示。用于格式化弹出窗口的CSS没有标准方法。

我建议如果您需要特殊格式化的工具提示，则使用onmouseover（）属性并自己生成弹出窗口。正如其他人所指出的，如果你想为你的代码添加对它的支持，你可以使用jQuery。对于比jQuery更轻量级的解决方案，请参阅SkinnyTip

Answer 6

这不会对TD进行样式设置，但是可以快速解决，这可能是您正在寻找的东西：

<td><a title="Sample Title">test</a></td>

如何将样式应用于'td'标签的'title'属性

6 个答案: