是否可以始终显示输入“数字”的向上/向下箭头？

Question

我想始终显示输入“数字”字段的向上/向下箭头。这可能吗？到目前为止，我还没有任何运气……

http://jsfiddle.net/oneeezy/qunbnL6u/

HTML:

 <input type="number" />

CSS：

 input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {

   -webkit-appearance: "Always Show Up/Down Arrows";

}

原文由 Oneezy 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以通过使用 Opacity 属性来实现这一点（至少在 Chrome 中）：

 input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {

   opacity: 1;

}

如上所述，这可能只适用于 Chrome。所以在野外使用此代码时要小心，不要为其他浏览器提供回退。

原文由 BJack 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

我试过了，它奏效了

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

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

在这里找到

原文由 Atta H. 发布，翻译遵循 CC BY-SA 4.0 许可协议