[英]How to change border-radius of progress bar value?
我无法更改HTML5 <progress>
元素值的border-radius。 我尝试将一个边界半径应用于progress元素本身并progress[value]
,但这似乎没有做任何事情。
这是我到目前为止: https : //jsfiddle.net/8m93Lorn/1/
有任何想法吗?
为此,您需要这样做:
看起来这些是重复的,但这实际上确保它适用于所有浏览器
progress {
border: 0;
height: 40px;
border-radius: 20px;
}
progress::-webkit-progress-bar {
border: 0;
height: 40px;
border-radius: 20px;
}
progress::-webkit-progress-value {
border: 0;
height: 40px;
border-radius: 20px;
}
progress::-moz-progress-bar {
border: 0;
height: 40px;
border-radius: 20px;
}
希望这可以帮助!
在我的chrome作品中使用此代码
progress[value]::-webkit-progress-bar {
background-color: #ededed;
border-radius: 40px;
}
progress[value]::-webkit-progress-value {
border-radius: 40px;
background-color:lightblue;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.