非标准
该特性是非标准的,请尽量不要在生产环境中使用它!
::-webkit-progress-inner-element
CSS 伪元素选择了 <progress>
元素。他是 ::-webkit-progress-bar
伪元素的父元素。
注意: 为了使 ::-webkit-progress-value
生效, <progress>
元素的-webkit-appearance
需要设置为 none
。
例子
HTML
<progress value="10" max="50">
CSS
progress {
-webkit-appearance: none;
}
::-webkit-progress-inner-element {
border: 2px solid black;
}
Result
应用了上述样式的进度条如下:
规范
不属于任何规范。这是WebKit/Blink专有的一个伪元素。
浏览器兼容性
BCD tables only load in the browser
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.
参考
- The pseudo-elements used by WebKit/Blink to style other parts of a
<progress>
element: ::-moz-progress-bar
::-ms-fill