異なるブラウザーでファイル入力要素のカーソルを変更するにはどうすればよいですか?

ファイル入力要素のカーソル タイプの変更

ユーザーは、タイプ「ファイル」の入力要素のカーソル タイプを変更する際に問題が発生する場合があります。 (提供されている例のように) CSS スタイル ブロック内でカーソル プロパティを設定しようとすると、望ましい結果が得られない可能性があります。

解決策:

ファイル入力の動作要素はブラウザごとに異なります:

• Firefox: Firefox は、
• Safari: Safari はカーソルの種類を変更する方法をサポートしていません。
• Chrome: Chrome はカーソルの種類のカスタマイズをサポートしています。 ::webkit-file-upload-button を使用したカーソルpseudo-class.

この矛盾に対処するための Chrome (および WebKit 実装を備えた Opera) の部分的な解決策は次のとおりです。

input[type=file], /* FF, IE7+, chrome (except button) */
input[type=file]::-webkit-file-upload-button { /* chromes and blink button */
    cursor: pointer; 
}

説明:

スタイル定義は、入力要素全体とファイル アップロード ボタンを表す疑似クラスの両方を対象としています。 Chrome の動作は、カーソル プロパティの処理によって説明できます。入力フィールドのカーソルを設定できますが、その中のボタンの設定は継承されません。

このソリューションを使用すると、Chrome のファイル入力要素のカーソル タイプを変更でき、複数のデバイス間で一貫したユーザー エクスペリエンスを提供できます。複数のブラウザ。

以上が異なるブラウザーでファイル入力要素のカーソルを変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。