怎么修改input type="file"的默认样式

<input type="file"/>的这个默认样式真的是简单明了啊~

怎么改成自己想要的效果呢? 

讲这个input框设置成 opacity：0，然后再在外面框个盒子，设置成自己想要的样式即可！

下面是我当时候要做的效果，然后就发现了这么个牛逼的东西：

代码：

<div class="upfile">
	<p><span>请上传文件</span><i></i></p>
	<input type="file" class="form-control btn " id="file" style="opacity: 0;"  @change="getFile($event)"/>
</div>

p{
	position: absolute;
	right: 0.4em;
	top: 0.4em;
	display: flex;
	justify-content: space-between;
	width: 95%;
}
i{
	display: inline-block;
	width: 2em;
	height: 1.5em;
	background: url(../../static/image/ic_uploading_normal.png) no-repeat center;
}
.upfile{
	color: white;
	border: 1px solid #7d7290;
	padding: 0;
	height: 2.4em;
}

效果：

HTML <input> 标签的 type 属性：https://www.w3school.com.cn/tags/att_input_type.asp