只在CSS上标?

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

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

我目前拥有的是这样的:

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

但这并不奏效。

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

当前回答

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

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

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

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

其他回答

老实说，我不认为在CSS中只做上标/下标有什么意义。它没有方便的CSS属性，只有一堆本地实现，包括:

.superscript { position: relative; top: -0.5em; font-size: 80%; }

或者使用垂直对齐或者其他方式。问题是，事情开始变得复杂了:

CSS上标行高间距; 注意CSS的上标/下标为什么你可以说不应该样式上标/下标的CSS;

第二点值得强调。通常，上标/下标实际上不是样式问题，而是表示意义。

旁注:尽管这个问题与数学上标和下标表达式无关，但值得一提的是这个常见数学上标和下标表达式的实体列表。

sub/sup标记在HTML和XHTML中。我会用这些。

至于CSS的其他部分，伪元素和内容属性的:after并没有得到广泛支持。如果你真的不想把这个手动放在HTML中，我认为基于javascript的解决方案是你的下一个最佳选择。使用jQuery，这是简单的:

$(function() {
  $("a.external").append("<sup>+</sup>");
};

CSS文档包含了所有HTML结构的行业标准CSS等价物。也就是说:现在大多数web浏览器都没有显式地处理SUB, SUP, B, I等等——它们(有点)被转换成具有适当CSS属性的SPAN元素，而渲染引擎只处理这些。

这个页面是附录d。HTML 4的默认样式表

你想要的是:

small, sub, sup { font-size: .83em }
sub             { vertical-align: sub }
sup             { vertical-align: super }

我不确定这是否相关，但我已经解决了我的问题²HTML实体，因为我无法在<label>标签内添加任何其他HTML标签。所以这个想法是使用ASCII码而不是css或HTML标签。

相关或不相关，使用上标作为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;
}

推荐文章