HTML リファレンスマニュアル

HTML タグ一覧

HTML5: <progress> タグ

HTML内のprogress ( <progress>) 要素は、タスクの完了進捗を表示するために使用されます。規格には、この要素がどのように表示されるべきかの具体的な定義はありませんが、ブラウザ開発者は自由に決定できます。ただし、通常、この要素は進捗バーの形式で表示されます。

オンライン例

マーク"ダウンロード進捗"：

例

!doctype　html>
<html>
<head>
　　<title>HTML5　progressタグの使用(基本チュートリアルウェブ　oldtoolbag.com)</title>
　　<meta　charset="UTF-8">
</head>
<body>
　　　　<p>This　is　a　live　example　of　the　HTML5　element　<a　href="//ja.oldtoolbag.com"><progress></a></p>
　　　　<progress　value="70"　max="100">70　%</progress>
</body>
</html>

テストしてみる‹/›

ブラウザの互換性

IEFirefoxOperaChromeSafari

IE 10、Firefox、Opera、Chrome、Safari 6 は <progress> タグをサポートしています。

注記：IE 9 またはより古いバージョンのIEブラウザは <progress> タグをサポートしていません。

タグの定義及び使用方法

<progress> タグは進行中のタスクの進行状況（進行）を定義します。

HTML 4.01 と HTML5の間の違い

<progress> タグは HTML5 に新しいタグがあります。

ヒントと注意

ヒント：タスクの進行状況を表示するために、<progress> タグと JavaScript を一緒に使用してください。

注記：<progress> タグは測定値（例えば、ディスク空間の使用状況や関連するクエリ結果）を表示するのに適していないです。測定値を表示する場合は、以下を使用してください。 <meter> タグで置き換えます。

属性

New ：HTML5 に新しい属性があります。

属性	値	説明
maxHTML5	number	完了すべき値を指定します。
valueHTML5	number	進行状況の現在値を指定します。

グローバル属性

<progress> タグのサポート HTMLのグローバル属性。

イベント属性

<progress> タグのサポート HTMLのイベント属性。

HTML: <q> タグ HTML: <picture> 要素