ホームページ >ウェブフロントエンド >CSSチュートリアル >JavaScript を使用せずにファイル アップロード ボタンのスタイルを設定するにはどうすればよいですか?
ファイル アップロード ボタンをカスタマイズする多くの試みは、JavaScript または Quirksmode のアプローチに頼ることが多く、これには寸法と自動調整の点で制限があります。この記事では、
<label class="myLabel"> <input type="file" required/> <span>My Label</span> </label>
label.myLabel input[type="file"] { position:absolute; top: -1000px; } .myLabel { border: 2px solid #AAA; border-radius: 4px; padding: 2px 5px; margin: 2px; background: #DDD; display: inline-block; } .myLabel:hover { background: #CCC; } .myLabel:active { background: #CCF; } .myLabel :invalid + span { color: #A44; } .myLabel :valid + span { color: #4A4; }
この例では、非表示にします。ファイルアップロードボタンはposition:absoluteとtop:-1000pxを使用し、
以上がJavaScript を使用せずにファイル アップロード ボタンのスタイルを設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。