使 SVG 文本元素绝对定位（即不占用 space）？

Question

我有一个包含和元素的简单 SVG 示例。我希望元素的行为类似于绝对定位的 HTML 元素，这样它就不会占用 space（与相对或静态定位的元素相反）。理想情况下，这会导致单词 "hello" 出现在蓝色方块内。这是我的代码：

<svg width="130" height="130" viewBox="0,-14,100,114">
    <rect width="100" height="100" style="fill:#0094ff;" />
    <text>hello</text>
</svg>

Answer 1

这是您需要做的。

其中X和Y是位置的坐标，你可以填任何你需要的位置。

来源：SVG

<svg class="svgIcon" width="130" height="130" viewBox="0,-14,100,114">
    <rect width="100" height="100" style="fill:#0094ff;" />
    <text x="0" y="12">hello</text>
</svg>

使 SVG 文本元素绝对定位（即不占用 space）？

Make SVG text element absolute positioned (i.e. not take up space)?

html

css

svg

css-position