我正在尝试将 <text>
居中<path>
里面元素。路径是使用 @opsb 绘制的圆很好的答案。我可以使用 text-anchor='middle'
将文本水平居中.
有没有办法让它垂直居中?
<svg width="200px" height="200px" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path id='path' fill="transparent" stroke='red' stroke-width='6'/>
<text x="100" y="100" font-family="Verdana" font-size="50" fill="blue" text-anchor='middle'>5</text>
</svg>
JSFiddle使用 JavaScript。
最佳答案
您需要使用alignment-baseline 使文本垂直居中。
类似这样的事情:
<text x="100" y="100" font-family="Verdana" font-size="50" fill="blue" text-anchor='middle' alignment-baseline="central">5</text>
关于javascript - 垂直对齐 svg 圆内的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35489442/