css - 如何使上标与最后一个点的顶部对齐

Question

如何显示上标使其位于点的顶部？代码在这里

<div >5.<sup>22</sup></div>

Answer 1

Example

好的。所以我检查了一下，默认格式有两个主要问题。

首先，<sup>跟随时期，而不是在时期之上。解决这个问题的最好方法可能是负边距，因为如果之后有更多文本，相对位置会留下空白。如果您使用像 em 这样的相对大小而不是 px如果尺寸发生变化，调整起来会更容易。

接下来是获取普通文本的顶部和<sup>在顶部对齐。默认 vertical-align对于 <sup>实际上略高于该行的顶部，因此将其重置为顶部几乎可以让您到达那里。然后调整行高以完成其余工作。

sup {
    margin-left: -0.25em;
    vertical-align: top;
    line-height: 1.1;
}