定製<input type =「file」>？

Question

我需要在我的窗體中添加一些定製<input type=「file」>

我試圖用這個代碼

<div id="upload-file-container"> 
    <input type="file" name="pic[]" class="photo" value="Add photo" /> 
</div> 

CSS

#upload-file-container { 
position: relative; 
width: 50px; 
height: 20px; 
overflow: hidden; 
} 

#upload-file-container input { 
position: absolute; 
left: 0; 
top: 0; 
font-size: 20px; 
opacity: 0; 
margin: 0; 
padding: 0; 
border: none; 
width: 50px; 
height: 20px; 
} 

但我輸入剛剛成爲無形。
http://jsfiddle.net/FXTCg/4/
如何使可見輸入標題「添加照片」？

Answer 1

請看看這個：http://jsfiddle.net/gabrieleromanato/mxq9R/。您的輸入需要隱藏opacity: 0，因爲您無法在其中應用任何樣式或自定義文本。您需要將您的可見內容放在其下面