H5去掉输入框type为number时的上下箭头

html5中，input type="number"时右边会有一个上下小箭头，介绍去掉这个箭头的方法，完成浏览器的兼容，页面效果的统一

一。公共样式

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>去掉输入框type为number时的上下箭头</title><style>/*谷歌*/input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;}/*火狐*/input[type="number"] {-moz-appearance: textfield;}</style></head><body><input type="number" ...></body>
</html>

二。专用样式

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>去掉输入框type为number时的上下箭头</title><style>/*在谷歌下移除input[number]的上下箭头*/.inputNumber input[type='number']::-webkit-outer-spin-button,.inputNumber input[type='number']::-webkit-inner-spin-button {-webkit-appearance: none !important;margin: 0;}/*在firefox下移除input[number]的上下箭头*/.inputNumber input[type="number"] {-moz-appearance: textfield;}</style></head><body><input type="number" class="inputNumber" placeholder="请输入电话号码"> 1</body>
</html>

H5去掉输入框type为number时的上下箭头相关推荐

html上下箭头控制文本框加减,HTML5去掉输入框type为number时的上下箭头的实现方法...
html5中,input type="number"时右边会有一个上下小箭头,介绍去掉这个箭头的方法,完成浏览器的兼容,页面效果的统一一.公共样式去掉输入框type为numb ...
input标签type为number时如何去除加减按钮效果
我们在使用input type = number 时只想输入数字时会出现如下图所示的效果显然这不是我们想要的只需要我们简单把css样式改变下即可 /* 谷歌 */input::-webkit- ...
解决：input框当type为number时maxlength失效
慕客网标明的用法是适用type为text和passswod的当我input框设置type为number的时候怎么限制输入长度呢?使用outinput就可以啦 <input type=" ...
去掉input type=“number“ 输入框内右侧上下箭头
需求: 原生input标签当type为number时,鼠标聚焦input框会在右侧会出现上下箭头调整数字的按钮,此时ui设计图要求去掉这个上下箭头解决方案在样式内写上如下代码: //谷歌 inpu ...
input 类型为 number 时如何去掉数字加减上下箭头
input 类型为 number 时,输入框右侧有数字加减按钮,想将该按钮去掉添加以下 css 代码 /* input 类型为 number 时去掉数字加减上下箭头 */ input::-webki ...
input的type=number时可以输入字母e的解决方式
在开发中遇到的问题,当输入框input的type=number时,仍然可以输入字母e或E,查了资料后才知道,原来当type=number时,计算机是这么处理的:主要原因是e在数学上代表的是⽆理数,是⼀ ...
input输入框type设置为number，maxlength无效
<input type="number">时,maxlength无效 type设置为text.tel,maxlength才有效解决方案 <input type= ...
input type=number时，限制输入位数
1.当input,type为text时,设置maxlength后,能限制输入内容长度: 2.当input,type为tel时,设置maxlength后,也是能限制输入内容长度,并且弹起键盘为默认为数字 ...
项目总结（input输入框type设置为number，maxlength无效，设置为tel，maxlength有效）
这是一个小细节,以前很少注意,直到最近做的一个项目,当我把一个输入数字的input框的类型设置为number时,input框还是可以无限输入,设置maxlengh=10就不起作用了,然后我就去百度了一 ...

H5去掉输入框type为number时的上下箭头

H5去掉输入框type为number时的上下箭头

H5去掉输入框type为number时的上下箭头相关推荐

最新文章

热门文章