[英]Vertically/Horizontally Center Text inside a SVG Path
我想在一个用SVG Path
元素制作的矩形内垂直/水平居中文本。
按中心我并不是说我的第一个字母位于矩形的中心,而是将文本的中心放在路径的中心。
这是我的代码结构:
<svg id="shape">
<path id = "a" d="M 0 0 L 100 0 L 100 100 L 0 100 Z"></path>
<text>
<textPath xlink:href="#a">My Text</textPath>
</text>
</svg>
我通过做这样的事情设法实现了这个目标:
<svg id="shape">
<path id = "a" d="M 0 0 L 100 0 L 100 100 L 0 100 Z"></path>
<text x="50" y="50" text-anchor="middle" alignement-baseline="middle">My Text</text>
</svg>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.