SVG删除文本上方/下方的填充
提问于 2018-12-13 09:18:01
我正在尝试从SVG文本元素中删除上面/下面的填充。
下面是现在的情况：
好了！
我想成为的样子：
这是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>
正如你从图片链接中看到的，上面和下面只有填充。
如果有人能帮我去掉这个垫子，我将不胜感激。
提前谢谢。
回答 2
Stack Overflow用户
发布于 2018-12-13 09:26:30
从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>
Stack Overflow用户
发布于 2018-12-13 15:18:17
“填充”是字体的一部分。它是为超出大写字母高度或低于基线的字符保留的空间。你不能把它移走。它将始终包含在<text>元素的边界框中。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53758492
复制相关文章
腾讯云开发者
