只在CSS上标?

我怎么能得到上标做，只有在CSS?

我有一个样式表，我用上标字符标记外部链接，但我很难让字符正确对齐。

我目前拥有的是这样的:

a.external:after {
  font-size: 50%;
  vertical-align: top;
  content: "+";
}

但这并不奏效。

当然，我会使用<sup>-标签，只有当内容允许HTML…

当前回答

查看:http://www.cssdesignpatterns.com/Chapter%2012%20-%20ALIGNING%20CONTENT/Vertical-aligned%20Content/example.html

如果你想要"vertical-align:text-top"

其他回答

你可以用vertical-align: super来做上标(加上相应的字体大小减小)。

但是，一定要阅读这里的其他答案，特别是保罗默里和cletus的答案，以获得有用的信息。

相关或不相关，使用上标作为HTML元素或在文本中作为span+css可能会导致本地化程序中的本地化问题。

例如，我们说“第三方软件”:

3<sup>rd</sup> party software
3<span class="superscript">rd</span> party software

译者如何翻译“rd”?他们可以为一些西里尔语言留空，但其他外来语言或RTL语言呢?

在这种情况下，最好避免使用上标，并使用完整的措辞，如“第三方软件”。或者，正如这里在其他评论中提到的，通过jQuery在上标中添加加号。

下面摘自Mozilla Firefox的内部html.css:

sup {
  vertical-align: super;
  font-size: smaller;
  line-height: normal;
}

所以，在你的情况下，它会是这样的:

.superscript {
  vertical-align: super;
  font-size: smaller;
  line-height: normal;
}

sup的用法如下:

.superscript{
    vertical-align:super;
    font-size:smaller;
}

发现这通过谷歌铬检查元素。

查看:http://www.cssdesignpatterns.com/Chapter%2012%20-%20ALIGNING%20CONTENT/Vertical-aligned%20Content/example.html

如果你想要"vertical-align:text-top"

推荐文章