我在更改 HTML5
<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;
}