html - 使用CSS或其他代替js将小数显示为上标

Question

我有很多:

<span class="price">17.998,80</span>

客户希望我替换为:

<span class="price">17.998<sup>80</sup></span>

...好吧，让 javascript...但是等等!

难道不能通过一些花哨的 CSS/CSS 技巧获得相同的结果吗？

(大 $ 数字，无小数点，上标分 - ，是我的小数点分隔符)

亲切的问候，

斯蒂恩

注意:这很好用:

$('span.price').html($('span.price').html().replace(',','<sup>')+'</sup>');

但首选是所有 CSS/CSS3 解决方案

Answer 1

最好的方法是找到所有价格并添加 HTML <sup> ... </sup>因为如果有人不加载 javascript，就没有 HTML 标记。

并且没有 CSS 技巧可以做到这一点。

CSS 做的唯一一件事就是将样式应用于 <sup>元素。