0

$ が残りのテキストの半分の高さになるように、このテキストの最初の文字に css $50.00 を上付きにします。

cssでこれを行うにはどうすればよいですか？テキストの最初の記号を選択して css で上付きにする方法はありますか?

4

1 に答える 1

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 の before と after をサポートしているわけではありません。

それ以外の場合は、次のように 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>
于 2011-04-27T12:05:30.507 に答える