input type=number的输入框里面的上下箭头去掉
2020-12-08 本文已影响0人
小呆糊总
input type=number每次输入数字时,多出来的上下黑箭头不想用,但是又想使用number输入控制

<el-input class="numberInputStyle"></el-input>
样式如下:
.numberInputStyle input[type=number] {
-moz-appearance:textfield;
}
.numberInputStyle input[type=number]::-webkit-inner-spin-button,
.numberInputStyle input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
这样,依然只能输入数字,其他不可输入

CSS3 appearance 属性
所有主流浏览器都不支持 appearance 属性。
Firefox 支持替代的 -moz-appearance 属性。
Safari 和 Chrome 支持替代的 -webkit-appearance 属性。
