HTML5 progress元素不呈現任何子元素？

Question

代碼是：

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

這100%無論是包裹在span標籤，P的，div的，其他的進步，從來都沒有使它得到顯示。在Chrome和Opera上運行W7x64。

這是默認行爲嗎？我是否應該在position:absolute的進度條上寫字？

Answer 1

原來，<progress>標籤中的內容是後備的人誰不支持HTML5的瀏覽器。

http://lea.verou.me/2011/07/a-polyfill-for-html5-progress-element-the-obsessive-perfectionist-way/

Answer 2

一個<progress>的內部內容只會在不 支持it.This瀏覽器呈現類似的行爲<video>，<canvas>等獲得Chrome和Opera支持<progress>。

如果要渲染進度條本身的百分比，請嘗試使用 use :: after和data屬性。排序窮人的數據綁定：

<style> 
#progress:after { 
    content: attr(data-percent) '%'; 
    margin-left: 5px; 
} 
</style> 

<div id="progress" data-percent="10"> 
    <progress max="100" value="10" min="0"></progress> 
</div> 

你必須添加一個變化監聽更新data-percent當進度的 值的變化。

參見： http://jsbin.com/asuqow/edit#html,live