表单控件美化：自定义表单控件的显示效果

原理：隐藏input元素，通过其他标签定义自己想要的样子

input{
    display: none;
}
input[type="file"] + div{
    background: fuchsia;
    color: #fff;
    width: 200px;
    padding: 10px 30px;
    text-align: center;
    border-radius: 10px;
    letter-spacing: 5px;
}

<form action="">
    <label>
        <input type="file">
        <div>文件上传</div>
    </label>
</form>

 效果图：