数字入力フィールドの矢印をどうやって隠すか
- 前のページ 入力ボックスをクリアする
- 次のページ テキストをクリップボードにコピーする
CSSを使って数字入力フィールドから矢印/微調整ボックスを削除する方法を学びます。
2つの数字入力フィールドにマウスを合わせて、違いを確認してください:
隠された矢印:
デフォルト:
機能説明:数字入力フィールド内でホイールをスクロールすると、数字を増やすことができます。
矢印を隠す
/* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance: textfield; }
関連ページ
チュートリアル:HTMLフォーム
リファレンスマニュアル:HTML <input type="number">
- 前のページ 入力ボックスをクリアする
- 次のページ テキストをクリップボードにコピーする