文件上传图片覆盖在上传框上

最新推荐文章于 2024-08-29 21:19:22 发布

随风漂流的

最新推荐文章于 2024-08-29 21:19:22 发布

阅读量1.5k

点赞数 1

分类专栏： javascript

本文链接：https://blog.csdn.net/zhengjunlove/article/details/73333730

版权

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

1.css部分代码

.input-file:hover {
	background:#ccc;
	cursor: pointer;
}
.input-file {
	display:inline-block;
	margin:0 0 0 0 !important;
	position:relative;
}

.input-file input {
	opacity:0;
	filter:alpha(opacity=0);
	font-size:100px;
	position:absolute;
	top:0;
	right:0;

2.html页面这里div.input-file换成其它标签同样有效

 <div class="input-file" type="button"  οnclick="">
        <img src="ico31.png" /> 
          <input type="file" style="height:50px;width:100%;" id="file" name="files[]" multiple  /> 
       </div>

3.用绝对定位和相对定位把file上传框和图片重叠，把fie上传框透明度设为0