::-moz-progress-bar

非標準
この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

CSS::-moz-progress-bar 擬似要素Mozilla 拡張で、 <progress> 要素の中のプログレスバーを表します。 (バーは進捗した量を表します。)

構文

::-moz-progress-bar

HTML

<progress value="30" max="100">30%</progress>
<progress max="100">Indeterminate</progress>

CSS

::-moz-progress-bar {
  background-color: red;
}

/* 不確実なバーは強制的に幅をゼロにする */
:indeterminate::-moz-progress-bar {
  width: 0;
}

結果

上記の最初のバーは次のようになります。

Custom styled progress bar

関連情報