HiddenFile é uma biblioteca baseado em jQuery que facilita a aplicação de CSS em input tipo “file”. Utilização: Você precisa adicionar a biblioteca jQuery, HiddenFile e o arquivo CSS da biblioteca no head de sua página. Depois basta adicionar a classe hiddenfile em algumas destas tags <a>, <area>, <img />, <input type=button /> e  <input type=file />

GitHub e Exemplo Online

Adicionar em seu site.

<head>
  …
  <link href=”stylesheets/hiddenfile.css” media=”screen” rel=”stylesheet” type=”text/css” />
  <script src=”jquery.min.js” type=”text/javascript”></script>
  <script src=”javascripts/hiddenfile.js” type=”text/javascript”></script>
  …
</head>

Exemplos de utilização:

<a href=”javascript:void(0)” class=”hiddenfile”>adicionar mais fotos</a>

<input type=”button” class=”hiddenfile” value=”adicionar arquivos”/>

<input type=”file” class=”hiddenfile” name=”filename” id=”filename”>

Você poderá mudar a mensagem de selecionar a imagem usando o parâmetro title.

<a href=”javascript:void(0)” class=”hiddenfile” title=”Selecione uma foto de seu computador.”>adicionar fotos</a>