progress要素:属性情報
属性 | 用途 | 必須 | 設定値 |
---|---|---|---|
form | フォームとの関連付け | - | 関連付けるform要素に指定したid名 |
max | 全体の作業量 | - | 0以上 (浮動小数点数、初期値は 1) 省略した場合は1と見做す |
value | 進捗状況 | - | 0以上 ~ max属性値以下 (浮動小数点数) 省略した場合は未確定プログレスバーとして表示 |
実装例1:0%の進捗を表示する
HTML5コード
1 |
サンプル進捗1:<progress value="0" max="1">0%</progress> |
実行結果
サンプル進捗1:
実装例2:50%の進捗を表示する
HTML5コード
1 |
サンプル進捗2:<progress value="0.5" max="1">50%</progress> |
実行結果
サンプル進捗1:
実装例3:ダウンロード中を表示する
HTML5コード
1 |
サンプル進捗3:<progress max="1">ダウンロード中・・・</progress> |
実行結果
サンプル進捗2: