WebKit ブラウザで数値入力スピナー ボタンを削除するにはどうすればよいですか?

Webkit の入力タイプ「数字」スピナー ボタンを抑制する

モバイル ユーザー (Mobile Safari) とデスクトップ ユーザー (Chrome の両方) 向けに Web サイトをデザインする場合、Safari)、 を使用して数値入力用に指定された入力フィールドの見た目の美しさを考慮してください。タグ。モバイルでは、このタグはテンキーパッドによる数値入力を最適に容易にします。ただし、Chrome と Safari では、これらのフィールドの横に不要なスピン ボタンが表示され、デザインの美しさと衝突する可能性があります。

CSS を使用してスピナー ボタンを無効にする

CSS を使用してこれらのボタンを削除するにはでは、次のコードを利用します:

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

このコードは、内側と外側のスピン ボタンを効果的に非表示にします。数値入力フィールドのクリーンで洗練されたデザインを保証します。さらに、入力フィールドの周囲に不要なスペースができないように、これらの要素のマージンを必ずゼロに設定してください。

以上がWebKit ブラウザで数値入力スピナー ボタンを削除するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。