就像許多人一樣，我想自訂醜陋的 input type=file，並且我知道如果沒(méi)有一些 hack 和/或 javascript 就無(wú)法完成。但是，問(wèn)題是，就我而言，上傳檔案按鈕僅用於上傳圖像（jpeg|jpg|png|gif），所以我想知道是否可以使用“clickable”圖像與輸入類(lèi)型檔案完全相同（顯示對(duì)話框，並在提交的頁(yè)面上顯示相同的$_FILE）。
我在這裡找到了一些解決方法，這也很有趣（但不適用於 Chrome =/）。
當(dāng)你想為文件按鈕添加一些樣式時(shí)，你們會(huì)怎麼做？如果您對(duì)此有任何觀點(diǎn)，請(qǐng)點(diǎn)擊回答按鈕;)
1
0
0
這對(duì)我來(lái)說(shuō)非常有效：
.image-upload>input {
display: none;
}
<div class="image-upload">
<label for="file-input">
<img src="https://icons.iconarchive.com/icons/dtafalonso/android-lollipop/128/Downloads-icon.png"/>
</label>
<input id="file-input" type="file" />
</div>
基本上，標(biāo)籤的 for 屬性使得點(diǎn)擊標(biāo)籤與點(diǎn)擊指定的輸入相同。
此外，將顯示屬性設(shè)為 none 可以使檔案輸入根本不呈現(xiàn)，從而將其隱藏得乾淨(jìng)整潔。
在 Chrome 中進(jìn)行了測(cè)試，但根據(jù)網(wǎng)絡(luò)，應(yīng)該適用於所有主要瀏覽器。 :)
編輯： 此處新增了 JSFiddle： https://jsfiddle.net/c5s42vdz/
