在数字输入、CSS、HTML 上增加向下和向上箭头的大小答案

【问题标题】：Increase the size of the down and up arrow on the number input, CSS, HTML在数字输入、CSS、HTML 上增加向下和向上箭头的大小
【发布时间】：2020-03-23 12:54:35
【问题描述】：

有没有办法通过CSS来增加数字输入框右侧的上下箭头的大小？只是向上和向下箭头，而不是整个输入框，或者至少按比例。看这个例子：

.size-36 {
font-size: 36px;
}

.size-12 {
font-size: 12px;
}

<input type="number" class="size-36" value="2" min="0" max="10" step="1">
<input type="number" class="size-12" value="2" min="0" max="10" step="1">

<input type="number" value="2" min="0" max="10">

当前结果：

【问题讨论】：

Making up down arrow of HTML's input number very bigger and cleaner的可能重复
@TechWisdom 这个问题是问如何使整个输入框更大——而不仅仅是向上和向下箭头。我的问题是问如何让向上和向下箭头键更大，所以这是一个不同的问题。

标签： html css

【解决方案1】：

没有官方的方法来设置input元素的样式；你将不得不带着一个黑客。这些答案显示了几种方法：

主要问题是在哪里放置较大的箭头。您不想更改输入的大小，这意味着箭头只能变宽（或者它们不再适合输入）。你必须想办法解决这个问题。

可能的解决方案：在输入元素之后显示箭头，隐藏它们，除非你将鼠标悬停在元素上，使用光标键增加/减少数字，所以你根本不需要鼠标。

【讨论】：

【解决方案2】：

您可以只更改输入“数字”元素的字体大小。这也会增加箭头按钮的大小。也许不完全是你要找的，但无论如何=

<input type="number" value="1" min="1" max="8" style="font-size: 55px;">

【讨论】：

正是我想要的。谢谢！