如何禁用数字输入中的箭头？

在本文中，我们将看到如何禁用数字输入中的箭头。

请参阅下面的图像，第一张图像具有默认箭头，第二张图像没有箭头。

默认输入框(有箭头)

没有箭头的输入框。

为此，我们使用以下语法：

方法一：

对于 chrome、Safari、Edge、Opera：

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

对于火狐：

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

例子：

HTML

  

    

  

    

      GeeksforGeeks
    
  
    

        How to disable arrows from
        Number input using CSS?
    
  
    

  

输出 ：

方法2：这种方法简单而强大。使用inputmode=”numeric”属性 你可以找到一个没有箭头的输入框。较旧的浏览器可能不支持此功能，例如 Internet Explorer 和 Safari，但大多数现代浏览器，如 Chrome、Firefox、Edge、Opera 都支持此属性。此属性的主要目的是在移动设备中提供数字输入界面。

例子 ：

HTML

  

    
GeeksforGeeks
  
    

        Disable arrows from number input
    
  
  

  

输出 ：