0

解決できないように見える奇妙なスタイルの問題があるファイルアップロードボタンがあります。生成された HTML は次のとおりです。

<div id="uniform-file_upload" class="uploader">
<input id="file_upload" type="file" multiple="multiple" name="file_upload" size="55" style="opacity: 0;">
<span class="filename" style="-moz-user-select: none;">No file selected</span>
<span class="action" style="-moz-user-select: none;">Choose File</span>
</div>

出力は次のとおりです。

ここに画像の説明を入力

「ファイルを選択」という言葉の周りに小さなボックスが表示されているのがわかりますか? それは非常に醜く、気を散らすものであり、簡単に取り除けるはずだと思っていましたが、私にはできません。

4

1 に答える 1

1

このような状況では、Chrome Web ブラウザーを使用して[ Inspect Element ] オプションを試すのが良いデバッグ方法です。フォーム ボタン (Web ページ内) を右クリックし、[要素の検査] を選択します (FireFox にも同様の機能がありますが、Chrome のほうが好みです)。

ボタンのスタイル情報がサイド パネルに表示され、スタイルを微調整して必要な効果を得ることができます。

注意: [要素の検査] をクリックした後、[要素] タブ セクションで正しい html タグを選択したことを確認してください。また、element.style {...} はサイド パネルのオプションであり、選択した html 要素のインライン css を編集できます。

于 2012-05-11T20:07:37.477 に答える