只在CSS上标?

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

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

我目前拥有的是这样的:

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

但这并不奏效。

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

当前回答

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

其他回答

如果你正在改变字体大小，你可能想用下面的规则停止缩小大小:

sup sub, sub sup, sup sup, sub sub{font-size:1em !important;}

我在一个页面上工作，目的是有清晰易读的文本，上标元素不改变行顶部和底部的空白-以下是观察结果:

如果你的主文本有行高:例如1.5em，你应该降低上标文本的行高以使其正确显示。我使用线高:0.5em。

此外，vertical-align: super在大多数浏览器中都运行良好，但在IE8中，当你有一个上标元素时，该行其余部分会被下推。因此，我使用vertical-align: baseline加上负的顶部和position: relative来达到同样的效果，这似乎在各种浏览器中都能更好地工作。

因此，要添加到“本地实现”:

.superscript {
    font-size: .83em;
    line-height: 0.5em;
    vertical-align: baseline;
    position: relative;
    top: -0.4em;
}

.superscript {
  position: relative;
  top: 5px;
  font-size: 90%;
  vertical-align: super;
}

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 }

推荐文章