想展示一个<input type="range" />
发布于 2018-03-26 15:58:17
对于Chrome,请使用-webkit-appearance: slider-vertical
。
对于IE,使用writing-mode: bt-lr
。
对于Firefox,添加一个orient="vertical"
属性设置为html。可惜他们是这样做的。视觉样式应该通过CSS来控制,而不是HTML。
input[type=range][orient=vertical]
{
writing-mode: bt-lr; /* IE */
-webkit-appearance: slider-vertical; /* WebKit */
width: 8px;
height: 175px;
padding: 0 5px;
}
<input type="range" orient="vertical" />
发布于 2018-03-26 17:19:07
可以使用CSS转换来完成这个任务,但是要注意容器的高度/宽度。此外,可能需要将其放置在较低的位置:
input[type="range"] {
position: absolute;
top: 40%;
transform: rotate(270deg);
}
<input type="range"/>
或3D转换等效:
input[type="range"] {
transform: rotateZ(270deg);
}
https://stackoverflow.com/questions/-100007790
复制相似问题