如何更改HTML5进度条颜色内联？

Question

我需要根据一些PHP值更改进度条的颜色。我不熟悉WebKit技术，但据我所知，它是改变进度条颜色的唯一方法。所以，我需要做这样的事情：

<progress style="progress::-webkit-progress-value { background: red; }" max="<?php echo $max; ?>" value="<?php echo $val; ?>"></progress>

Answer 1

根据值更改bg颜色，类似下面的内容将起到作用：

progress[value^="5"] {
  background-color: blue;
}

对于以数字5开头的所有值，它将蓝色应用于条形。

Answer 2

之前已经回答过这个问题。见How to write a:hover in inline CSS?。

就像:hover是选择器的一部分一样，::-webkit-progress-value也是选择器的一部分。不幸的是，style属性允许您仅指定规则。