正文
设置input的样式
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
css中的 ” 七层重叠法 ” ：即网页内容先后顺序分别为：背景边框，负值z-index，display:block，浮动，display:inline-block，z-index:auto，正值z-index，越往后在网页中的层级越靠前，也就是说如果一个z-index值为1或者更高的话，它就会遮挡掉他之前的所有元素。
利用这个法则以及opacity设置透明度，可以模拟一个样式：
<style>
*{
margin:;
padding:;
}
.uploadbox{
width:150px;
height:150px;
margin:100px;
position:relative;
}
.uploadbox input{
cursor:pointer;
width:%;
height:%;
position:absolute;
left:;
top:;
z-index:2;
opacity:0;
filter: alpha(opacity=0);
}
.uploadbox-bg{
position:absolute;
width:%;
height:%;
border:1px solid #cccccc;
background:#dfdfdf;
z-index:1;
}
.uploadbox-bg p,.uploadbox-bg span{
text-align:center;
}
.uploadbox-bg p{
font-size:80px;
color:#;
}
.uploadbox-bg span{
display:block;
font-size:14px;
color:#;
}
.uploadbox:hover .uploadbox-bg p,.uploadbox:hover .uploadbox-bg span{
color:blue;
}
</style><div class="uploadbox">
<input type="file" id="uploadbox" value="上传" />
<div class="uploadbox-bg">
<p>+</p>
<span>点击上传</span>
</div>
</div>
参考文章：http://www.cnblogs.com/ztfjs/p/select.html
注意：文章里面关于select设置样式的方法不兼容ie
