我的 HTML 页面处于某种奇怪的模式，其中 sup 和 sub 标签不会升高或降低线上方的字符，尽管它们确实会按应有的方式减小字符的大小。我放了一个简单的
<body>
<p class="sample" style="margin-left:10px;">X<sup>2</sup> T<sub>3</sub></p>
在我的页面顶部，打印的内容是:
我已经尝试了各种字体和大小并重新加载页面，但我还没有找到任何可以修复它的方法。如果我将相同的代码放在 jsfiddle 中，它可以正常工作:
有人知道会发生什么吗？
谢谢。
最佳答案
我有同样的问题，这是由于 reset.css 引起的。
要解决此问题，请实现以下 CSS(可在此处找到:https://gist.github.com/unruthless/413930):
sub, sup {
/* Specified in % so that the sup/sup is the right size relative to the surrounding text */
font-size: 75%;
/* Zero out the line-height so that it doesn't interfere with the positioning that follows */
line-height: 0;
/* Where the magic happens: makes all browsers position the sup/sup properly, relative to the surrounding text */
position: relative;
/* Note that if you're using Eric Meyer's reset.css, this is already set and you can remove this rule */
vertical-align: baseline;
}
sup {
/* Move the superscripted text up */
top: -0.5em;
}
sub {
/* Move the subscripted text down, but only half as far down as the superscript moved up */
bottom: -0.25em;
}
关于HTML <sup> 和 <sub> 不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17437847/