如何一直显示input中的增加减少按钮

要一直显示input中的增加减少按钮，你可以使用CSS的伪元素:before和:after来实现。以下是一个例子：

HTML代码：

<div class="input-wrapper">
  <input type="number" value="0" min="0" max="10">
</div>

CSS代码：

.input-wrapper input[type="number"]::-webkit-inner-spin-button,
.input-wrapper input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

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

.input-wrapper input[type="number"]:before,
.input-wrapper input[type="number"]:after {
  content: "";
  display: block;
  position: absolute;
  width: 16px;
  height: 16px;
  background: #ccc;
  cursor: pointer;
}

.input-wrapper input[type="number"]:before {
  top: 0;
  left: -20px;
  border-radius: 50% 0 0 50%;
}

.input-wrapper input[type="number"]:after {
  bottom: 0;
  left: -20px;
  border-radius: 0 50% 50% 0;
}

这段代码会将input的type设置为number，并使用CSS来隐藏默认的增加减少按钮。然后使用:before和:after伪元素来创建自定义的增加减少按钮，通过绝对定位和背景颜色来样式化按钮。

注意，这段代码只适用于WebKit浏览器（如Chrome和Safari）。如果你需要在其他浏览器中使用，请添加相应的前缀或使用其他技术来实现