html – 下标和上标相同的元素

发布时间：2020-12-14 19:33:14 所属栏目：资源来源：网络整理

导读：有什么办法可以将下标和上标添加到同一个元素吗？如果我做 Sample TextsubSub/subsupSup/sup 上标出现在下标之后.我有一个想法是做一些像： table tr td rowspan='2' valign='center'Sample Text/td tdSup/td /tr tr tdSub/td /tr/table 似乎做这个工作,但是

有什么办法可以将下标和上标添加到同一个元素吗？如果我做

Sample Text<sub>Sub</sub><sup>Sup</sup>

上标出现在下标之后.我有一个想法是做一些像：

<table>
    <tr>
        <td rowspan='2' valign='center'>Sample Text</td>
        <td>Sup</td>
    </tr>
    <tr>
        <td>Sub</td>
    </tr>
</table>

似乎做这个工作,但是很丑陋.任何更好的想法？

谢谢！

解决方法

我不是CSS大师,但你可以尝试一些沿着 http://jsfiddle.net/TKxv8/1/的路线

有很多硬编码的价值观,对其他元素的影响可能只能在之后被发现,但它是一个很好的起点.

Sample Text 
<span class='supsub'>
    <sup class='superscript'>Sup</sup>
    <sub class='subscript'>Sub</sub>
</span>

.supsub {position: absolute}
.subscript {color: green; display:block; position:relative; left:2px; top: -5px}
.superscript {color: red; display:block; position:relative; left:2px; top: -5px}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!