効果: <!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. テーブルを作成する1. deptテーブルを作成する テーブル「d...
HTML フォームは、さまざまな種類のユーザー入力を収集するために使用されます。 HTML フォー...
a href="#"> リンクをクリックすると、ページがページ上部までスク...
概要実際のビジネス シナリオ アプリケーションでは、ビジネス条件に基づいて対象データを取得およびフィ...
まず効果を見てみましょう: マウスを画像の上に移動すると、影の効果とテキスト/アイコンが追加されます...
序文JS の型付けが弱く、記述基準が緩く、開発ツールのサポートが弱いため、前任者のコードをメンテナン...
スペースを購入してウェブサイトを構築したことがある友人なら、ウェブサイトは正式に開設する前に登録する...
以前、グループの友人が質問しました。つまり、ミニプログラムでユーザーがオンラインになったときに、ライ...
ブロック要素p - 段落テキストの事前フォーマットテーブルol - ソートフォームul - 順序なし...
目次SSL証明書の作成1. 秘密鍵を生成する2. 証明書要求ファイルを生成する3. CRT証明書ファ...
この記事では、参考までにメッセージボードを実装するためのJavaScriptの具体的なコードを紹介し...
目次序文アイデアの起動速度Tomcat ログが文字化けしている序文Idea を再インストールしたので...
MySQL SQL ステートメントにコメントを追加できます。MySQL SQL ステートメントのコメ...
この記事では主に、オブジェクト内のフィールドを削除するための js の実装を紹介し、次のように共有し...
序文:データベースのバックアップの重要性は、特にデータの損失が深刻な結果を招く可能性がある実稼働環境...