CSSで可変矩形を生成し、内側勾配の背景を持つ

Question

PHPには0〜100の値を持つ変数がいくつかあります。数字（0,1、50）が与えられた場合、とsoo）。また、私はバックグラウンドにいくつかのグラデーションを追加したい、PHPでこれを行う複雑で、私はこれはCSSで可能です知っているので、私のサーバーでは、より多くの負荷をしたくないが、私はCSSの開発者ではありません。だから、もし、どんな体が私にこれを助けることができるなら。このページ（http://www.answerbag.com/）では、上記のページの中央にあるプールセクションの結果で、矩形をどのようにしたいかを確認できます。

Answer 1

これは幅を知っているので非常に簡単です。グラデーションの全範囲を表示することをお勧めしますので、<img id="score1" src="blue_gradient.png">のCSS #score1 { width: 30px }を使用してグラデーション画像のサイズを変更したい場合があります。その後、多くの丸隅の方法の1つを使用して、 。