0

クランのウェブサイト用の CMS を開発しています。メンバーが獲得した経験値に基づいて昇格できるメンバー ランクのテーブルがあります。次のランクまで昇格するまでの進捗状況を表示するプログレス バーを作成したいと思います。私がやりたいのは、昇進してから獲得した経験値に基づいて、黒いバーを緑で塗りつぶすことです。メンバーの進行状況に基づいてパーセンテージを求める式があります。たとえば、メンバーが現在のランクから次のランクまで 67% 進んだ場合、黒いバーの長さの 67% が緑で塗りつぶされます。これがすべて理にかなっていることを願っています。これを達成するための最良の方法は何だと思いますか?

4

2 に答える 2

1
<div style="background-color:black;overflow:hidden;width:100px;height:30px">
    <div style="float:left;background-color:green;width:67%;height:30px">
    </div>
</div>

background-color の代わりに、幅 100px (両方の画像)、高さ 30px の background-image を使用できます。

于 2013-03-30T00:58:33.440 に答える
0

単純な CSS を使用してください -- ここで生成する画像は必要なものではありません。ただし、必要な場合でも、考えられるすべてのランク パーセント値に対して 100 個の画像を 1 回生成し、それらをスクリプトで使用します。

于 2013-03-30T00:59:53.603 に答える