Css 自界说文件上传控件样式（兼容 IE6）
发布时间：2018-10-06 07:11:37 所属栏目：创业 来源：站长网
导读：要想直接通过 CSS 来节制文件上传控件，根基没戏的。虽然也有一些办理方案，譬喻 Mr.Think 的这篇文章《操作label标签和CSS美化文件上传表单(不兼容IE6)》。昨天也刚好碰着了这个题目，随手记录下吧。 起首，给 input type=file 元素戴个套子，这样较量安
|
要想直接通过 CSS 来节制文件上传控件，根基没戏的。虽然也有一些办理方案，譬喻 Mr.Think 的这篇文章《操作label标签和CSS美化文件上传表单(不兼容IE6)》。昨天也刚好碰着了这个题目，随手记录下吧。
起首，给 <span class="input-file">赏识...<input type="file"></span> 有了这个安详的外层容器，我们就可以开搞了。题目的焦点有两点：第一，把丑恶的原生上传控件给藏起来；第二，支持点击上传成果。 要害的代码片断： .input-file {
overflow:hidden;
position:relative;
}
.input-file input{
opacity:0;
filter:alpha(opacity=0);
font-size:100px;
position:absolute;
top:0;
right:0;
}
个中，字体巨细 100px 的缘故起因在于放大上传控件右侧的按钮地区，团结靠右定位，可以或许担保鼠标 cursor 为 default 状态。 其它，假如要支持鼠标悬停结果，也是可以的，把 <a href="javascript:void(0);">赏识...<input type="file"></a> 貌似是全兼容的？横竖 IE 是可以的。本身看吧，懒得看兼容了。 演示：
（编辑：河北网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
