input 标签 type=file时,如何美化原有样式

如何将原生态文件上传的样式变更成一个按钮

1、首先在前端页面上,新建一个button 按钮和附件上传的input标签,然后将input标签通过“display:none” 给隐藏

<div>
	<input type='file' id='file' accept='.doc,.docx' style='display:none'/>
	<button id='uploadFile'>附件上传</button> 
</div>

2、编写按钮的点击事件,通过jquery 去触发input标签的点击事件

<script>
	$('#uploadFile').click(function(){
		$('#file').click();
	})
</script>

3、再根据自己需求,设置一下按钮布局和样式即可