如何从 SVG 元素中停用元素，就像它不存在一样

Question

我有一个SVG地图，上面有很多层(Places(和文本。我不想在这些地方添加hover效果，但每当curser出现在文本上(位于这些地方上方(时，hover效果就会消失。有没有一种方法可以停用文本元素(已更改为曲线(，就像它不执行exest一样？所以悬停效果不会消失？

.circle{
position:absolute;
top:100px;
left:50px;
width:100px;
heigth:100px;
background-color:red;
border-radius:50px;
text-align:center;
}
.background{
width:200px;
height:200px;
background-color:gray;
display:flex;
justify-content:center;
align-items:center;
}
.background:hover{
background-color:white;
}

<div class="background">
</div>
<div class="circle">001</div>

在本例中，background-element是我的Map，001 element是我的弯曲文本。

Answer 1

你的圆圈需要在你的背景中。

<div class="background">
<div class="circle">001</div>
</div>