我造型input[type=range]使用CSS，并用做thumb和track。
所有三个( -ms, -moz, -webkit) 浏览器都有适当的前缀。
但是，我不知道什么供应商前缀适合progressWebkit 浏览器（例如 Chrome）上的样式。在 Internet Explorer 和 Microsoft Edge 上，-ms-fill-lower效果很好。
在 Firefox 上，使用-moz-range-progress解决了这个问题。
input[type=range] {
/*removes default webkit styles*/
-webkit-appearance: none;
/*fix for FF unable to apply focus style bug */
border: 1px solid white;
/*required for proper track sizing in FF*/
width: 350px;
}
/* Webkit, Chrome & Safari */
input[type=range]::-webkit-slider-runnable-track {
width: 300px;
height: 5px;
background: …