改变input[type=file]的默认样式

自定义上传按钮样式的终极解决方案--input透明法

<style>

.div1{

float: left;

height: 41px;

background: #f5696c;

width: 144px;

position:relative;

}

.div2{

text-align:center;

padding-top:12px;

font-size:15px;

font-weight:800

}

.inputstyle{

    width: 144px;

    height: 41px;

    cursor: pointer;

    font-size: 30px;

    outline: medium none;

    position: absolute;

    filter:alpha(opacity=0);

    -moz-opacity:0;

    opacity:0; 

    left:0px;

    top: 0px;

}

</style>

　　

<div class="div1">

    <div class="div2">上传图片</div>

    <input type="file" class="inputstyle">

</div>

 

如此就可以是实现“点击$(".div2")上传文件”的效果了。

转载于:https://www.cnblogs.com/weizaiyes/p/6384453.html