用户@enxaneta指出我指向foreignObject。
它工作正常（即使在webbrowser Edge中也是如此）。
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<style>
div {
color: white;
font: 18px serif;
height: 100%;
overflow: auto;
}
</style>
<polygon points="5,5 195,10 185,185 10,195" />
<!-- Common use case: embed HTML text into SVG -->
<foreignObject x="20" y="20" width="160" height="160">
<!--
In the context of SVG embedded in an HTML document, the XHTML
namespace could be omitted, but it is mandatory in the
context of an SVG document
-->
<div xmlns="http://www.w3.org/1999/xhtml">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sed mollis mollis mi ut ultricies. Nullam magna ipsum,
porta vel dui convallis, rutrum imperdiet eros. Aliquam
erat volutpat.
</div>
</foreignObject>
</svg>CodePen：https：//codepen.io/guettli/pen/RwwBxQL
就这样吧！
.wrapper{
position: relative;
width: 100px;
height: 100px;
}
.text{
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
color: white;
}<html>
<body>
<div class="wrapper">
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="red" stroke-width="4" fill="blue" />
</svg>
<div class="text">
TEXT
</div>
</div>
</body>
</html>