::-webkit-progress-value
非标准: 该特性是非标准的,请尽量不要在生产环境中使用它!
::-webkit-progress-value
CSS 伪元素 代表的是<progress>
元素中进度条未完成的部分。它是::-webkit-progress-bar
伪元素的子元素。
备注:
为了使 ::-webkit-progress-value
生效, <progress>
元素的-webkit-appearance
需要设置为 none
。
示例
HTML
html
<progress value="10" max="50"></progress>
CSS
css
progress {
-webkit-appearance: none;
}
::-webkit-progress-value {
background-color: orange;
}
结果
应用了上述样式的进度条如下:
规范
不属于任何规范。这是 WebKit/Blink 专有的一个伪元素。
浏览器兼容性
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
::-webkit-progress-value |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Non-standard. Check cross-browser support before using.
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
参见
-
WebKit/Blink 使用的用来修改
<progress>
元素其他部分样式的伪元素: ::-moz-progress-bar
::-ms-fill