zoukankan      html  css  js  c++  java
  • 移除input在type="number"时的上下箭头

    网页在有些情况下,会需要input的输入的为单纯数字的文本框,此时type=number,但使用type=number时,输入框后面会有一个上下箭头,那么如何去掉上下箭头呢?

    1、chrome浏览器移除

    input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
            -webkit-appearance:textfield;
    }

    使用none替代textfield,也可以实现去除箭头的效果

    2、firefox浏览器下移除

    input[type="number"]{
            -moz-appearance:textfield;
    }

     在firefox浏览器下使用none替代textfield没有效果。

    3、用type="tel"代替

      input[type="tel"]的value值亦是number,且其没有type="number"时的上下箭头,故我们可以用[type="tel"]代替[type="number"],达到一样的效果,并通过设置maxlength = "m"限定value值得长度。

      如果有其他的要求,可以通过正则来判断。

      

  • 相关阅读:
    python
    shader example
    shader 关键字
    Android Studio如何导出可供Unity使用的aar插件详解 转
    adb
    知识
    Unity实现模拟按键
    小知识
    图种制作命令
    八卦
  • 原文地址:https://www.cnblogs.com/intangible/p/6291493.html
Copyright © 2011-2022 走看看