0

我正在尝试从 SVG 文本元素中删除上方/下方的填充。

现在是这样：

带有填充的 TEXT 的图片！

我想成为怎样的人：

https://i.imgur.com/gk1wBAe.png

这是 SVG 代码

<svg xmlns:svg="http://www.w3.org/2000/svg" id="svg" style="margin-top: 100px;" viewBox="0 0 1656 614" preserveAspectRatio="xMinYMin meet">
  <g id="mySVG">	
    <text x="0" y="0" dx="0" dy="0" fill="#000"  style="font-family: DINPro; font-size: 120px;" dominant-baseline="hanging" class="text-0">TEEEEEEXT</text>
  </g>
</svg>

正如您从图片链接中看到的那样，只有上方和下方有填充。

如果有人可以帮助我如何删除此填充，我将不胜感激。

提前致谢。

4

2 回答 2

0

从 svg 中删除样式属性（以删除顶部的“填充” - 尽管它是边距）并减少 viewBox 属性中的最后一个数字以删除底部的“填充”（尽管那是 svg 的高度） - 下面我已将高度从 614 降低到 120（字体大小）。

如果您希望字体更大，您可能还需要从 1656 减小宽度（因为 svg 设置为保留其纵横比）

<svg xmlns:svg="http://www.w3.org/2000/svg" id="svg" viewBox="0 0 1656 120" preserveAspectRatio="xMinYMin meet">
  <g id="mySVG">	
    <text x="0" y="0" dx="0" dy="0" fill="#000"  style="font-family: DINPro; font-size: 120px;" dominant-baseline="hanging" class="text-0">TEEEEEEXT</text>
  </g>
</svg>

于 2018-12-13T09:26:29.500 回答
0

“填充”是字体的一部分。它是为超出大写字母高度或低于基线的字符保留的空间。你不能删除它。它将始终包含在<text>元素的边界框中。

于 2018-12-13T15:18:16.517 回答