在SVG中，在相同的X轴上添加上标和下标

我想在SVG中将上标和下标放在文本的同一位置。这是数学和化学方程式中的一项要求。在SVg中似乎没有这样的需求选项

要求是当上标和下标放在某个文本旁边时，它们的x原点值必须相同。这些超级和下标可能出现在文本之前或之后，且要求适用于这两种情况。首先，我尝试使用SVG的元素和x&y坐标放置它们，效果非常好（附件1）。但是，当以编程方式查找每个元素的x&y坐标时，就会出现问题

然后我尝试使用元素并应用dx，这也很好，但dx随字体大小而变化。在尝试实现自定义解决方案之前，我想知道是否有更好的解决方案

我附上了我使用的代码和示例图像

我的第一次尝试

B
A.
±
Z
C

第二次尝试使用SVG的推荐元素

A.
Z
B
±
C

第三次尝试使用tspan元素的负dx

A.
Z
B
±
C

没有错误消息。预期结果和实际结果如附图所示。
1。所有SVG元素的x&y坐标的结果

2。使用推荐的text&tspan元素和super和sub的基线偏移值生成结果

3。带有text&tspan和减号dx值的下标结果

---

如果您继续使用SVG，那么一个可能对您有用的建议是为下标和上标坐标偏移使用

em

单位。这样，它们将独立于您为主要角色设置的字体大小

请参见以下示例，其中两个SVG之间的唯一区别是

font size

CSS设置

#一个{
宽度：250px；
字体系列：无衬线；
字体大小：48px；
}
#两个{
宽度：250px；
字体系列：无衬线；
字体大小：32px；
}

B
A.
±
Z
C
B
A.
±
Z
C

听起来您使用了错误的技术，应该改用mathml。这类似于我之前问的一个问题，但这是一个纯HTML问题，因为这是一个SVG问题。HTML和SVG编码之间有一些相似之处，但这种情况下的结果有所不同。这是一个适用性有限的很酷的解决方案。它对大多数符号都有好处，但对于U（铀）和W（钨）这样的字符就不够了。对于两个字母符号，如钙，情况更糟。我想我仍然可以在符号之前将其用于super/sub。谢谢你的时间。我认为这个解决方案仍然是正确的方向。现在唯一的问题是±和下标C的dx值。我可以使用bbox获取基本符号的结束点，并以编程方式计算±和C的PX值的起始点。我会尝试一下，然后让您知道。在这种情况下，字体大小与“em”有什么关系？如果1em等于48px（如第一种情况），1.1em是否表示52.8px？我还读到“em只是字体大小。在一个2in字体的元素中，1em意味着2in”。然而，如果我用52.8px替换1.1em，它就不能像px和em中的字体大小那样工作。对于这种明显的差异有什么好的解释吗？@VelusamyVelu“1.1em”和“52.8px”应该给出完全相同的结果。这里有一个例子。绿色和蓝色文本被精确覆盖。我感谢你的答复。但是对不起，我的问题不是很清楚。我使用em和px设置dx（dx='1.1em'&dx='52.8px'），发现它们不一样。我在原问题中提出的要求需要更好的解决方案。