一直以來，input 上傳按鈕對前端人員來說就是個頭痛的事情，因為它不像 input 輸入框這樣，可以輕鬆的用 css 樣式來實現自定義樣式，而 input 上傳按鈕這個產物我們要怎麼美化呢，今天跟大家分享一個純CSS美化上傳按鈕的方法，最主要是還兼容各大瀏覽器，先看效果：
運行效果
css樣式
html代碼
從上面代碼中可以看到，這裡我用的美化方法就是利用a標籤把這個上傳按鈕包起來，再配合相對定位和絕對定位把上傳按鈕給隱藏起來，以達到自定義樣式，經小編測試，這個方法可以兼容到各種瀏覽器，包括該死的IE6，有需求的網友可以測試一下。
謝謝你的閱讀，如果你有更好的方法或在應用過程中遇到問題可以在評論區提問或者直接私信我，我會定期回覆，碼農劉小橋與你一起學習，共同進步。
相關推薦
css實現多種效果展示的input框
html網頁中的input一般默認都是邊框比較多，當然可以自己用樣式來實現一些比較上等級的邊框修飾，如下：當進入到哪個input輸入文字時候，下劃線會從中...
PHP框架之ThinkPHP各模塊開發系列十一，快速引入HTML5上傳組件“WebUploader”
不多說，本節是製作如何在thinkphp中極其簡便快速的引入某度上傳組件webuploader。WebUploader是一個簡單的以HTML5為主，FLA...
推薦中...