美化上传文件的html代码

版权声明：博客知识产权来源命运的信徒，切勿侵权 https://blog.csdn.net/qq_37591637/article/details/88392739

上传文件图片的代码是这个

  <input  type="file" />

效果如下

 很丑的样式

very ugly!! 

---

思路：

1、把丑的样式设置透明

2、用一个好看的按钮来代替

3、一旦点击按钮就触发点击真正的选择文件

html代码如下

  <input id="ufile" type="file" id=""/>
            <input type="button" value="上传图片" class="btn" onclick="$('#ufile').click();"/>

css样式

#ufile{
opacity:0;
}
.btn{
width:40%;
background-color:#27AE60;;
color:white;
}