样式化 asp:fileupload 控件

Question

我在 asp.net 中有一个文件上传控件，如下所示：

<asp:FileUpload ID="File1" runat="server" Font-Size="Small" Width="100%" />  

出于某种原因，“浏览...”按钮没有应用我已应用于任何 input[type="button"] 控件的标准 CSS。

如何将相同的 CSS 应用于该控件的浏览按钮？

Answer 1

尝试这个

<input type="file" class="hidden" id="uploadFile"/>
<div class="button" id="uploadTrigger">Browse</div>

一些CSS

.hidden {
    display:none;
}
.button {
    border: 1px solid #333;
    padding: 10px;
    margin: 5px;
    background: #777;
    color: #fff;
    width:75px;
}

JS

$("#uploadTrigger").click(function(){
   $("#uploadFile").click();
});

演示