CSDN自定义File选择效果。
wangccsy
2012-09-04
376浏览量
简介：
csdn.rar
和标准的HTML的File控件不一样。
css样式(upload.css)
点击(此处)折叠或打开
@charset "utf-8";
a.
csdn.rar
和标准的HTML的File控件不一样。
css样式(upload.css)
- @charset "utf-8";
-
a.btn {
- width: 120px;
- height: 42px;
- overflow: hidden;
- display: block;
- text-decoration: none;
- background: url(chose_file.gif) left top no-repeat;
-
}
-
a.files {
- background-image: url(chose_file.gif);
-
}
-
/*file设为透明，并覆盖整个触发面*/
-
a.files input {
- margin-left: -350px;
- font-size: 30px;
- cursor: pointer;
- filter: alpha(opacity = 0);
- opacity: 0;
-
}
-
/*取消点击时的虚线框*/
-
a.files,a.files input {
- outline: none; /*ff*/
- hide-focus: expression(this.hideFocus = true); /*ie*/
- }
test.html
- link href="upload.css" rel="stylesheet" type="text/css" />
- a href="" class="btn files"> input id="txt_userfile" name="txt_userfile" type="file" onchange="" />
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
