我正在开发一个可点击的人体 svg，这样访问者可以点击他们受伤的部位，他们将被引导到相应的页面，svg 的代码太多无法添加到这里，所以我只添加最上面的部分:
<div class="svg">
<svg inkscape:version="0.92.3 (2405546, 2018-03-11)"
sodipodi:docname="bodynew.svg" version="1.1" viewBox="0 0 500 400"
xmlns="http://www.w3.org/2000/svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd">
<sodipodi:namedview bordercolor="#666666" borderopacity="1" fit-margin-
bottom="0" fit-margin-left="0" fit-margin-right="0" fit-margin-top="0"
gridtolerance="10" guidetolerance="10" inkscape:current-layer="svg4523"
inkscape:cx="260.76197" inkscape:cy="215.76186" inkscape:pageopacity="0"
inkscape:pageshadow="2" inkscape:window-height="837" inkscape:window-
maximized="1" inkscape:window-width="1440" inkscape:window-x="-8"
inkscape:window-y="-8" inkscape:zoom="1.5571096" objecttolerance="10"
pagecolor="#ffffff" showgrid="false"/>
<g>
<a xlink:href="#0" class="svg" data-Name="shape 1" data-tabindex="0">
我使用的 CSS 非常简单，它所做的只是在访问者悬停时突出显示链接。
a.svg {
cursor: pointer;
}
a.svg:focus {
fill: pink;
stroke: red;
stroke-width: 1;
}
a.svg:hover {
fill: pink;
stroke: red;
stroke-width: 1;
}
这按预期工作得很好，但一旦我更改窗口大小或移动到移动设备，链接就不再可点击，因此悬停功能消失了。
如有任何帮助，我们将不胜感激
谢谢
最佳答案
嗯，我不知道确切的问题是什么，但看起来 Bootstrap 导致 #pricing 部分的顶部填充扩展到整个 SVG。
快速修复是添加以下 CSS 规则(在加载 Bootstrap 之后):
#pricing .container .row:first-child { pointer-events: none; }
关于html - 调整浏览器大小时 SVG 图像中的链接消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51279915/