5

私は基礎を使用していますが、ファイル入力に関するドキュメントには何も見たことがなく、一般的な入力要素のみです。しかし、ファイル入力のスタイリングはそれほど簡単ではありません。また、すべてのブラウザでフォーム全体のデザインと一貫性を保ちたい場合は、さらに多くのことを行います。

Styling an input type="file" buttonやhttps://github.com/filamentgroup/jQuery-Custom-File-Inputのようないくつかのソリューションを見てきましたが、いつものように、基盤に特定の何かがあるかどうか知りたいと思いましたdiv スタイルのラッピングはまったく機能しません (div.large-3.columns など)。

どのようにしますか？

4

3 に答える 3

1

ボタンだけ必要ですか？または、ファイルのアドレスを含むフィールドも？ボタンのみの場合、最も簡単な解決策はデモです

<a class="wrapper">
    button name
  <input type="file"/>
</a>

.wrapper {
    width: 100px;
    height: 30px;
    overflow: hidden;
    position: relative;
}
input {
     position: absolute;
     right: 0;
     top: 0;
     bottom: 0;
     font-size: 50px; /* some huge for cursor pointer hack */
}

一部のブラウザでは疑似クラスを使用することもできます。記事を参照してください

于 2013-05-17T10:48:32.050 に答える
0

.button クラスを input タグに適用しました。それは私には十分に見えます。

于 2013-06-18T12:01:05.700 に答える