[HTML] input type="file" 태그에서 "찾아보기" 버튼을 이미지로 대체하는 방법

모바일 페이지 작성중, 이미지 찾아보기가 길어져서 디자인이 구린거임. 

그래서 이미지 등록 부분을 이미지화 할 필요가 있었는데.

외주 개발자가 "안된다", "불가능하다." 라고 했으나. 가능함.

아래 소스만으로도 충분. !! 
 

<span id="fileInputForm" style="position:relative; float:left; width:74px; height:20px; overflow:hidden; cursor:pointer; background-image:url('http://wstatic.naver.com/w9/btn_sch.gif');">

   <input type="file" id="atch_file" name="atch_file" value="" style='position：absolute; margin-left:-10px; width:74px; height:20px; filter:alpha(opacity=0); opacity:0; -moz-opacity:0; cursor:pointer;' onChange="fileUpload()">

</span>

출처 : http://itnpeople.blog.me/40100921559