찾아보기 버튼 바꾸기

참조 : http://tiagoe.blogspot.kr/2010/01/css-style-typefile-tags.html

//css

.file_input_textbox

{

 float: left

}

.file_input_div

{

 position: relative; 

 width: 100px; 

 height: 23px; 

 overflow: hidden;

}

.file_input_button

{

 width: 100px; 

 position: absolute; 

 top: 0px;

 background-color: #33BB00;

 color: #FFFFFF;

 border-style: solid;

}

.file_input_hidden

{

 font-size: 45px; 

 position: absolute; 

 right: 0px; 

 top: 0px; 

 opacity: 0; 

 

 filter: alpha(opacity=0); 

 -ms-filter: "alpha(opacity=0)"; 

 -khtml-opacity: 0; 

 -moz-opacity: 0;

}

// html

<input type="text" id="fileName" class="file_input_textbox" readonly="readonly">

 

<div class="file_input_div">

  <input type="button" value="Search files" class="file_input_button" />

  <input type="file" class="file_input_hidden" onchange="javascript: document.getElementById('fileName').value = this.value" />

</div>