html - 参照ボタンをリンクのようにスタイリングする

Question

重複の可能性:
HTML でのリンクである <button> の作成
CSS をブラウズ ボタンに適用する方法

参照ボタンをリンクのようにスタイルする方法は?

つまり、

<input type=file />

Answer 1

このアプローチを試してください：

1. 入力ファイルの上にdivをオーバーレイします。

2. 入力ファイルの不透明度を0に変更します。

   div.text {
       position: absolute;
       top: 0;
       left: 0;
       text-decoration: underline;
       color: blue;
   }
   div.wrapper {
       position: relative;
   }
   input { opacity: 0; }
   ​
   
   <div class="wrapper">
        <div class="text">I'm not a link you fool</div>
       <input type="file"/>
   </div>
   ​
   

デモ： http： //jsfiddle.net/codef0rmer/BZeMG/

Answer 2

このチュートリアルはあなたを助けるはずです、

http://www.quirksmode.org/dom/inputfile.html

Answer 3

の参照ボタンについて話している場合、<input type=file />それはできません。元のボタンをカスタムのものに置き換えるjquery/ajaxファイルアップロードプラグインを使用する必要があります。こちらのリストをご覧ください。

http://creativefan.com/10-ajax-jquery-file-uploaders/

そして気に入ったものが見つかれば。