我想用 css $50.00 为这个文本的第一个字符上标,这样 $ 只是文本其余部分高度的一半。
我怎么能用css做到这一点?有什么方法可以选择一段文本中的第一个符号并用css上标?
我想用 css $50.00 为这个文本的第一个字符上标,这样 $ 只是文本其余部分高度的一半。
我怎么能用css做到这一点?有什么方法可以选择一段文本中的第一个符号并用css上标?
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>