
正文
一个漂亮的上传按钮input[type=file]
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
.xj-file input[type=file]{border:none; outline:none; position:absolute; top:; left:0px; width:54px; height:34px; cursor:pointer; filter:alpha(opacity=0); opacity:;}
<div class="input-group xj-file xj-panel-top">
<span class="input-group-btn">
<button class="btn btn-default" type="button">浏览</button>
</span>
<input type="text" class="form-control" id="viewfile" placeholder="">
<input type="file" id="" onchange="document.getElementById('viewfile').value=this.value;">
</div>
基于bootstrap3,碰上一个处女坐的总监,不知道是福是祸,虽然我也是,这个最讨厌的上传按钮其实美化思路也非常简单
将其定位起来透明度设为0,再将其获取的路径值传给美化过的显示框就OK啦!效果图如下








