在HTML5中，新增了progress和meter控制項。 progress控件為進度條控件，可表示任務的進度，如Windows系統中軟體的安裝、檔案的複製等場景的進度。 meter控件為計量條控件，表示某種計量，適用於溫度、重量、金額等量化的表現。 目錄 1. 進度條 1.1 特性## 1.2 範例2. 計量條 2.1 特性 2.2 範例1. 進度條 說明：表示任務的進度，如Windows系統中軟體的安裝、檔案的複製等場景的進度。 1.1 特性 語法：50%登入後複製屬性##：max {number} ：設定或取得進度條的最大值。 缺省值：未設定此屬性時，控制項最大值為1。 value {number} ：設定或取得進度條的目前值。 缺省值：未設定此值時，此進度條為'不確定'型，無特定進度資訊；無max屬性時(進度條預設最高為1)，value的預設取值範圍為0.01~1.0，設定0.2時表示20%的進度。 最低瀏覽器版本支援：IE 10、Chrome 8控制項內容：當瀏覽器不支援此控制項時，將顯示控制項裡面的內容，支援此控制項的瀏覽器不會展示控制項的內容。 1.2 範例範例1：含有value屬性进度：25%登入後複製 ##範例2 ：含有max屬性进度：25%登入後複製 範例3：不確定進度條(無value屬性)进度：正在下载...登入後複製IE8 ：顯示文字內容。 IE11 ：顯示一個從左到右的動畫效果。 Chrome ：顯示一個從左到右，然後從右到左的動畫效果。 2. 計量條說明：表示某種計量，適用於溫度、重量、金額等量化的表現。 2.1 特性語法：进度：登入後複製登入後複製登入後複製屬性：value {number} ：設定或取得此控制項的值，必須在min與max值的中間。 max {number} ：設定此控制項的最大值。 缺省值：未設定此屬性時，控制項最大值為1。 min {number} ：設定此控制項的最小值。 缺省值：未設定此屬性時，控制項最小值為0。 low {number} ：設定過底的閾值，當value小於low並大於min時，顯示過低的顏色。 high {number} ：設定過高的閾值，當value大於high且小於max時，顯示過高的顏色。 optimum {number} ：設定最佳值，最低瀏覽器版本支援：IE 不支援、Chrome 8控制項內容：當瀏覽器不支援此控制項時，將顯示控制項裡的內容，支援此控制項的瀏覽器不會顯示控制項的內容。 2.2 範例範例1：無屬性进度：登入後複製 範例2：value < max(max預設為1.0)进度：登入後複製登入後複製登入後複製 範例3：value = max(max預設為1.0)进度：登入後複製# #範例4：value > max(max預設為1.0)进度：登入後複製 範例5：value < min(min預設為0)进度：登入後複製 示例6：value = min(min默认为0)进度：登入後複製 示例7：value > min(min默认为0)进度：登入後複製登入後複製登入後複製 示例8：value < high进度：登入後複製 示例9：value = high进度：登入後複製 示例10：value > high进度：登入後複製 示例11：value < low进度：登入後複製 示例12：value = low进度：登入後複製 示例13：value > low进度：登入後複製 示例14：optimum < low < value < high进度：登入後複製 示例15：low < optimum = value < high进度：登入後複製 示例16：low < value < high < optimum进度：登入後複製 示例17：value < low < high < optimum进度：登入後複製 示例18：optimum < low < high < value进度：登入後複製
