用css标记文本中的第一项

时间:2011-04-27 11:58:51

标签: css superscript

我想用css $ 50.00上标这个文本的第一个字符,这样$只是文本其余部分高度的一半。

我怎样才能用css做到这一点?有没有办法能够在一段文本中选择第一个符号并用css标注它?

1 个答案:

答案 0 :(得分:1)

span.price:before{ content:'$'; font-size:xx-small; vertical-align:top; }

这将使:

<p>The current price is <span class="price">100.0</span></p>

分为:

The current price is $100.0

除了$将是上标。

编辑:我再次测试了它,可以确认以上的工作。但是所有浏览器在css之前和之后都不支持。

否则你可以用这样的html来做:

<p>The current price is <sup class="price">$</sup>100.0</p>

两种解决方案的概念标记证明:

<!DOCTYPE html>
<html dir="ltr" lang="en-US"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta charset="UTF-8"> 
    <title>Price test</title> 
    <style>
        span.price:before{ content:'$'; font-size:xx-small; vertical-align:top; }
    </style>
</head> 
<body>
    <p>The price is <span class="price">100.0</span></p>
    <p>The price is <sup>$</sup>100.0</p>
</body></html>