HTML的<title> 标签可以缺省,html5 – 是否可以增强svg title工具提示的默认外观

你可以尝试这个：

How to change the style of Title attribute inside the anchor tag?.我没有测试它,所以我真的不知道它是否有效.

但是由于你使用SVG,你可以做得更好,因为你可以绘制任何颜色和形状的工具提示,甚至是动画.由于您使用脚本动态生成它,因此可以根据内容计算大小并相应地更改高度和宽度.

以下是在SVG中使用圆角矩形的工具提示示例：

Hello

我使用CSS悬停使其显示和消失：

#component .tooltip {visibility: hidden}

#component:hover .tooltip {

visibility: visible;

}

.tooltip text {

fill: black;

font-size: 12px;

font-family: sans-serif;

}

.tooltip rect {

fill: yellow;

stroke: blue;

}

你可以在JSFiddle中试验它.

您还可以将工具提示存储在< defs>中.阻止并在不同的对象中重用它.