在最新的Opera版本中设置<meter>标签样式

Question

我目前正在尝试在所有主流浏览器中设置<meter>标签的样式: IE7-9，FF，Chrome，Safari，甚至Opera。通过使用下面的CSS代码，我成功地删除了默认的<meter>样式：

meter::-webkit-meter-bar, meter::-webkit-meter-optimum-value, meter::-webkit-meter-suboptimum-value, meter::-webkit-meter-even-less-good-value {
  background: 0;
}

这项技术在所有提到的浏览器中都能正常工作，除了Opera！它一直显示默认的绿色计量器。关于如何在Opera中对<meter>标签“去样式化”有什么想法吗？

Answer 1

目前还没有办法在Opera中设置这些元素的样式。有一个名为Component Object Model的提案，它间接地允许我们在工作草案中进行这种样式设计，但我们还没有接近这样的提案。

Webkit实现了一个没有任何标准的方法，只是一个建议，我不认为它将来会是这样的。这些伪元素名称很可能会发生变化。

Answer 2

在我开始之前:它不应该是background: transparent;或background: inherit;吗？请参阅background property in HTML Dog。

我想你误会了。meter::-webkit-meter-bar选择器应该对IE、FF和Opera没有任何影响，因为-webkit部件是Webkit的选择器。Chrome和Safari使用Webkit作为渲染引擎，但是FF使用Gecko，Opera使用Presto，等等。

对于FF，你可能需要像-moz-meter-bar这样的东西...

至于歌剧我就不知道了。This Opera community page似乎暗示前缀应该是-o，而不是-webkit或-moz。

祝好运。

在添加这样的规则时，包含“正常”选择器也是一种很好的做法。

(如果你幸运的话，这可能会让它在Opera中正常工作。)

meter::-webkit-meter-bar,
meter::-webkit-meter-optimum-value,
meter::-webkit-meter-suboptimum-value,
meter::-webkit-meter-even-less-good-value,
meter::meter-bar,
meter::meter-optimum-value,
meter::meter-suboptimum-value,
meter::meter-even-less-good-value {
  background: transparent;
}