2015-06-17 94 views
3

有沒有辦法改變HTML米的背景顏色?如何更改HTML表格的背景顏色?

我知道,默認情況下它的背景顏色是綠色的。

這是可能將其背景顏色從綠色改變爲任何其他顏色?

我嘗試了style屬性,但它仍然保持綠色。

<meter style="background-color:red;"min="0" low="40" high="95" max="100" value="65"> 
</meter> 
+1

http://stackoverflow.com/questions/8094835/how-to-style-html5-meter-tag –

回答

3

meter::-webkit-meter-optimum-value { 
 
    background: red; 
 
} 
 
meter::-moz-meter-bar { /* Firefox Pseudo Class */ 
 
    background: red; 
 
}
<meter min="0" low="40" high="95" max="100" value="65"> 
 
</meter>

1

您需要選擇計值,比作風因此,對於更多的輸入參考這種link

meter::-webkit-meter-optimum-value { 
 
     box-shadow: 0 5px 5px -5px #999 inset; 
 
     background-image: linear-gradient(
 
     90deg, 
 
     #8bcf69 5%, 
 
     #e6d450 5%, 
 
     #e6d450 15%, 
 
     #f28f68 15%, 
 
     #f28f68 55%, 
 
     #cf82bf 55%, 
 
     #cf82bf 95%, 
 
     #719fd1 95%, 
 
     #719fd1 100% 
 
    ); 
 
     background-size: 100% 100%; 
 
    }
<meter value="0.6"></meter>

7

meter::-webkit-meter-optimum-value { 
 
    background: red; /* Green */ 
 
}
<meter min="0" low="40" high="95" max="100" value="65" col> 
 
</meter>

1

<meter min="0" low="40" high="95" max="100" value="65" col> 
 
</meter> 
 

 
meter::-webkit-meter-optimum-value { 
 
    background: red; /* Green */ 
 
}

3

鍍鉻:

/*meter */ 
meter::-webkit-meter-bar {background: #e6e6e9;} /*background color of bar*/ 
meter::-webkit-meter-optimum-value {background: green;} 
meter::-webkit-meter-suboptimum-value{background:orange;} 
meter::-webkit-meter-even-less-good-value{background:red;} 

用於Firefox:

/*meter */ 
/*bar with only one possible color*/ 
meter::-moz-meter-bar {background: red;} /* color of bar*/ 

/* bar with different colors*/ 
/* between "low" and "high" thresholds*/ 
meter::-moz-meter-optimum-value {background: lightgreen;} 
/*below "low" threshold or above "high" threshold*/ 
meter::-moz-meter-suboptimum-value{background:gold;}