如何將樣式應用於'td'標簽的'title'屬性

Question

我有以下代碼，並希望自定義'title'屬性的樣式。 有沒有辦法做到這一點。 提前致謝。

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

Answer 1

不是直接的。

你可以這樣做：

• JavaScript代碼： 請看這里

• 圖書館： 見這里

• CSS的一點解決方法請看這里

Answer 2

多年前這可能不是這樣 - 但現在可以設置Title屬性的樣式，請參見此處 。 這應該適用於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

這不會影響TD，但它是一個快速的解決方案，可能是你正在尋找的：

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

Answer 5

不同。不同的瀏覽器以不同的方式顯示標題工具提示，並且無法使用css對其進行樣式設置。 如果必須設置樣式，則需要尋找替代方法，例如使用jQuery顯示自定義工具提示 。

Answer 6

瀏覽器支持“title”屬性，通常作為工具提示。 用於格式化彈出窗口的CSS沒有標准方法。

我建議如果你需要一個特殊格式的工具提示，你可以使用onmouseover（）屬性並自己生成彈出窗口。 正如其他人所指出的，如果你想為你的代碼添加對它的支持，你可以使用jQuery。 對於比jQuery更輕量級的解決方案，請參閱SkinnyTip