type=file按钮样式改造

html：

<div class="file-wrap">
<input type="file" id="myfile" name="myfile" accept=".png,.jpeg,.jpg,.gif"/>
选择图片
</div>
css：

.file-wrap {
position: relative;
width: 119px;
height: 37px;
border-radius: 4px;
background-color: #ed4040;
background-repeat: no-repeat;
background-position: 0 0;
background-attachment: scroll;
line-height: 37px;
text-align: center;
font-size: 16px;
color: white;
cursor: pointer;
overflow: hidden;
float: left;
margin-right: 20px;
z-index: 1;
}

.file-wrap input {
position: absolute;
width: 119px;
height: 40px;
line-height: 40px;
font-size: 0;
opacity: 0;
-moz-opacity: 0;
left: 0px;
top: 0px;
cursor: pointer;
z-index: 2;
}

font-size:0;是关键。