Тег progress

Для индикации какого-либо процесса в HTML5 был добавлен тег Progress
Пример:
1
2
3
<progress value="5" max="100" onClick="this.value += 10">
Клинки меня
</progress>
Реализация:
Клинки меня
Перерисовывается полоса прогресса автоматически Пример стилизации:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<progress class="my" value="5" max="100" onClick="this.value += 10">
Клинки меня
</progress>
 
<style>
.my {
   background: #fff;
   border: 1px solid #aaa;
}
.my::-webkit-progress-bar {
  background: #fff;
}
.my::-moz-progress-bar {
  background: #fff;
}
 
.my::-moz-progress-value {
   background: #f00;
}
.my::-webkit-progress-value {
   background: #f00;
}
</style>
Клинки меня
Спасибо за внимание.
Если статья Вам показалась незаконченной или Вы знаете как её улучшить, пожалуйста сообщите мне e@gohtml.ru