数字输入 - 始终显示旋转按钮

Question

在谷歌浏览器中，input[type=number]旋转按钮仅在悬停时显示。

这是我使用的代码：

<input type="number" value="1" min="1" max="999" />

有没有办法随时显示旋转按钮？

Answer 1

您可以使用::-webkit-inner/outer-spin-button定位旋转按钮，而不是将opacity设置为1（旋转始终存在，但默认情况下它们有opacity: 0）。

代码：

<style>  

input[type=number]::-webkit-inner-spin-button {
    opacity: 1
}

</style>
<input type="number" value="1" min="1" max="999">

小提琴： http://jsfiddle.net/dk8fj/