在SVG路径中嵌套文本

根据这个:https://developer.mozilla.org/en-US/docs/Web/SVG/Element/path你不能嵌入<text>里面<path>

但是,您可以使用相邻元素作为悬停效果的触发器:http://jsfiddle.net/93ufH/1/

<svg>
    <rect x="10" y="10"  />
    <text x="0" y="50" font-family="Verdana" font-size="55" fill="blue" > 
        Hello
    </text>
</svg>

CSS

svg text{
    visibility:hidden;
}

svg rect:hover + text{
    visibility:visible;
}