我正在尝试样式化一个垂直范围输入框,下面是我的代码:
input[type='range'] {
-webkit-appearance: slider-vertical;
background-color: #ccc;
height: 158px;
width: 2px;
margin: 8px auto;
}
input[type='range']::-webkit-slider-thumb {
-webkit-appearance: none;
border-radius: 20px;
background-color: #3ebede;
height: 30px;
width: 30px;
}
但似乎因为我使用了 '-webkit-appearance: slider-vertical;' 让它垂直,样式不会应用。
有没有一种方法可以在不使用转换/插件的情况下为垂直范围设置样式...?
注:我只需要它在Chrome上工作
更新: 这是我所拥有的JSFiddle。