すべてのブラウザで数値入力フィールドの上/下ボタンを強制的に表示するにはどうすればよいですか?

数値入力フィールドの上/下ボタンの表示を強制できますか?

数値上に常に上矢印と下矢印を表示したい入力欄？いくつかのハードルに遭遇したかもしれません。これが解決策です:

HTML:

<code class="html"><input type="number"></code>

CSS:

<code class="css">input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: "Always Show Up/Down Arrows";
}</code>

残念ながら、この方法には制限があります

代替ソリューション: Opacity プロパティ

クロスブラウザー ソリューションの場合は、これを試してください:

<code class="css">input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  opacity: 1;
}</code>

このメソッドは矢印を強制します。表示されたままになりますが、すべてのブラウザで機能するとは限らないことに注意してください。非準拠ブラウザのフォールバックの実装を検討してください。

以上がすべてのブラウザで数値入力フィールドの上/下ボタンを強制的に表示するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。