input type=fileをCSSでクールにスタイルするサンプル:phpspot開発日誌

前の記事 ≪：CSSでクールにデザインされた階層ドロップダウンボックス実装jQueryプ...
次の記事 ≫：2009年4月24日管理人のブックマーク

input type=fileをCSSでクールにスタイルするサンプル

2009年04月24日-

スポンサードリンク

CSS2/DOM - Styling an input type="file"

input type=fileをCSSでクールにスタイルするサンプル。
input type=fileのファイル選択ボックスをスタイルしてクロスブラウザで動作させるのはそれなりに大変そうなのですが、そのサンプルが公開されています。

綺麗にデザインされたサイトなのに、ファイルの部分だけ「参照」ってなってて普通のボタンだとかっこ悪いかもという場合にこのサンプルが使えそうです。

実際にスタイルされたボックスは以下。
ファイル名が入る部分も角丸になっていて、ボタンもなかなかクールに仕上がっています。