使用css类隐藏HTML5输入类型编号箭头？-Java 学习之路

我之前在这里看到过这个问题Can I hide the HTML5 number input’s spin box?，其他一些人已经询问了一个特定的浏览器请求，在我的情况下我想知道的是：有没有办法创建像 .no-spin 这样的css类来隐藏旋转跨浏览器的箭头？

我试过了：

.no-spin {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance:textfield;
}

但是没有运气，事实上我对css的了解并不多 .

2 回答

答案

.no-spin::-webkit-inner-spin-button, .no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
    -moz-appearance:textfield !important;
}

<input type="number" class="no-spin"/>

回复于 2024-05-12T21:41:20+08:00

20
你可以在你的HTML中试试
```
<input type="text" pattern="[0-9]">
```
或者如果你真的想保留它作为数字，虽然安全性不会改变任何东西，也可以试试你的css：
```
.no-spin, .no-spin:hover, no-spin:focus {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance:textfield;
}
```
回复于 2024-05-12T21:41:20+08:00

使用css类隐藏HTML5输入类型编号箭头？

2 回答

答案

相关问题