0

重複の可能性：
プログレスバーの色を変更する方法

簡単なプログレスバーを作成しましたが、バーの背景色、パーセンテージの色、およびテキストの「最終更新日」の色を変更する方法がわかりません。導入する必要のあるコードはありますか？いくつかのコード/デモの例を手伝ってください。ありがとう

HTML：

  <table>
    <tr>
        <td>Last updated 1/4/2013:</td>
        <td><div class="progress" data-value="0"><span>0%</span></div></td>
    </tr>

CSS：

.progress.ui-progressbar {position:relative;height:2em;}
.progress span {position:static;margin-top:-2em;text-align:center;display:block;line-height:2em;padding-left:200px;padding-right:200px;}
.progress[aria-valuenow="0"] 
span {margin-top:0px;}​

JavaScript：

$(document).ready(function() {
    $(".progress").each(function() {
        var progressValue = $(this).data("value");
        $(this).progressbar({
            value: progressValue
        }).children("span").appendTo(this);
    });
});​
4

1 に答える 1

1

パーセンテージ バーの背景色を変更するには、次の CSS ルールを追加します。

.progress {
  color: red;
}

テキストの色:

<h1>最初にタイトルの周りにタグを追加して、次のようにすることをお勧めします。

<td><h1>Last updated 1/4/2013:</h1></td>

次に、次の CSS ルールを追加します。

td h1 {
  color: red;
}

パーセンテージの色を変更するには、次のルールを追加します。

.progress span {
  color: blue;
}

<table>また、タグを閉じます。

于 2013-01-04T21:45:33.623 に答える