::-webkit-progress-value

非标准

该特性是非标准的，请尽量不要在生产环境中使用它！

::-webkit-progress-value CSS 伪元素 代表的是<progress> 元素中进度条未完成的部分。它是::-webkit-progress-bar 伪元素的子元素。

注意: 为了使 ::-webkit-progress-value 生效， <progress> 元素的-webkit-appearance 需要设置为 none 。

说明

不属于任何规范。这是WebKit/Blink专有的一个伪元素。

示例

HTML

<progress value="10" max="50">

CSS

progress {
  -webkit-appearance: none;
}

::-webkit-progress-value {
  background-color: orange;
}

Result

应用了上述样式的进度条如下：

浏览器兼容性

BCD tables only load in the browser

参见