如何为CSS3 html5 progress元素设置颜色？ [英] How to set color for CSS3 html5 progress element?

问题描述

是否可以在HTML5中为元素设置bar的颜色（当您指定一个值时，该栏会填充到该值的位置）？如果是这样，怎么样？背景颜色和背景似乎没有任何影响。该技术是否与所有浏览器的最新版本交叉兼容？

解决方案

您可以在<$中设置条形图的颜色样式c $ c>< progress> 元素，通过更改一些浏览器专有选择器的背景。

在Firefox中，您可以使用以下内容：

 进度::  -  moz-progress-bar {background ： 蓝色;在Chrome或Safari中，您可以使用： 
 $ b $  
 
 
 
 
 
  progress ::  -  webkit-progress-value {background：blue; } 
  
在IE10中，您只需要使用颜色属性：
 进度{color：blue; } 
  
来源： http://html5doctor.com/the-progress-element/  
 
Is it possible to set the color of the "bar" for the  element in HTML5 (when you specify a value, the bar is filled up to the point of the value)? If so, how? background-color and background don't seem to have any effect. Is the technique cross compatible with the latest version of all browsers?
解决方案
You can style the color of the bar in the <progress> element by changing the background of a few browser-proprietary selectors.

In Firefox, you can use the following:
progress::-moz-progress-bar { background: blue; }
In Chrome or Safari, you can use:
progress::-webkit-progress-value { background: blue; }
In IE10, you just need to use the color attribute:
progress { color: blue; }
Source: http://html5doctor.com/the-progress-element/

                        
这篇关于如何为CSS3 html5 progress元素设置颜色？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！