効果: <!doctypehtml> <html> <ヘッド> <メタ文字セット="utf-8"> <title>無題のドキュメント</title> <スタイル> /*スタイル 1*/ .a-アップロード{ パディング: 4px 10px; 高さ: 20px; 行の高さ: 20px; 位置: 相対的; カーソル: ポインタ; 色: #888; 背景: #fafafa; 境界線: 1px 実線 #ddd; 境界線の半径: 4px; オーバーフロー: 非表示; 表示: インラインブロック; *表示: インライン; *ズーム: 1 } .a-アップロード入力{ 位置: 絶対; フォントサイズ: 100px; 右: 0; 上: 0; 不透明度: 0; フィルター:アルファ(不透明度=0); カーソル: ポインタ } .a-アップロード:hover { 色: #444; 背景: #eee; 境界線の色: #ccc; テキスト装飾: なし } /*スタイル 2*/ 。ファイル { 位置: 相対的; 表示: インラインブロック; 背景: #D0EEFF; 境界線: 1px 実線 #99D3F5; 境界線の半径: 4px; パディング: 4px 12px; オーバーフロー: 非表示; 色: #1E88C7; テキスト装飾: なし; テキストインデント: 0; 行の高さ: 20px; } .file 入力 { 位置: 絶対; フォントサイズ: 100px; 右: 0; 上: 0; 不透明度: 0; } .file:hover { 背景: #AADFFD; 境界線の色: #78C3F3; 色: #004974; テキスト装飾: なし; } </スタイル> </head> <body style="padding: 10px"> <a href="javascript:;" class="a-upload"> <input type="file" name="" id="">ファイルをアップロードするにはここをクリックしてください</a> <a href="javascript:;" class="file">ファイルを選択<input type="file" name="" id=""> </a> </本文> </html> 要約する 上記はエディターが紹介したCSS input[type=file]スタイルの美化(入力アップロードファイルスタイル)です。皆様のお役に立てれば幸いです。ご質問がございましたら、メッセージを残してください。エディターがすぐに返信いたします。また、123WORDPRESS.COM ウェブサイトをサポートしてくださっている皆様にも感謝申し上げます。 |
<<: ウェブページ作成時に標準 HTML コードを使用する際のポイント
>>: Vueはページdivボックスのドラッグアンドドロップソート機能を実装します
目次1. タイトル2. コード3. 結果IV. 結論1. タイトルテキスト ボックスに誕生日の値を入...
目次1.まず、main.jsページを設定します2. 対応するパスの下で言語パックを構成します。ここに...
echartsワードクラウドはechartsの拡張版ですhttps://echarts.apache...
序文group by と distinctive のパフォーマンス比較について: インターネット上の...
原因: NVIDIA グラフィック カード ドライバーが破損している解決:コマンドラインモードで再起...
非直交マージンマージンを使用するとマージが発生します次のプロパティはマージンの結合を防止します。国境...
最近、セキュリティ製品をテストする必要があったため、mariadb の起動ユーザーを root に調...
最終結果はこんな感じです、かわいいでしょう… PS: HTML と CSS の知識があればベストです...
ベクトル波 <svg viewBox="0 0 560 20" class...
1. 前提条件1. プロジェクトが展開されました2. Dockerはすでにインストールされている2...
目次概要同一生成元ポリシー (SOP)相同制限クロスドメインをバイパスクロスサイトリクエストフォージ...
免責事項:プロジェクトでは ROS 環境を使用する必要があるため、これは Ubuntu 20.04 ...
目次リストレンダリングキーの原理と機能主要原則の分析キーの役割要約するリストレンダリングキーの原理と...
XHTML の img タグはいわゆる自己終了タグであり、XML では完全に合法です。 XHTMLの...
Nginx の公式 Web サイトから Windows バージョンの Nginx をダウンロードしま...