bootstrapでファイルアップロードの見た目が悪いので、非表示にしてボタンに変更、ファイル名はJSで表示するようにしてみた

bootstrapでファイルアップロードの見た目が悪いので、非表示にしてボタンに変更、ファイル名はJSで表示するようにしてみた

bootstrapを適用しても、ほとんど標準と変わらない…。

こんな感じで、標準ファイル選択はdisplay:noneで非表示にして、class=”btn”でボタンっぽい表示にすればOK!

ただ、このままだとファイル名が表示されない(display:noneで全て非表示のため)
選択されているかどうか分からないので、ファイル名はJSで表示するようにしてみた