码迷,mamicode.com
首页 > Web开发 > 详细

CSS自定义上传文件按钮样式(兼容I6+)

时间:2015-04-12 19:06:19      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:

参考网址:http://www.alleyloft.com/contents/share?id=14
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>demo</title>
    <style>
        *{margin: 0;padding: 0;}
            .box{
                position:relative;
                float:left;
                overflow:hidden;
            }
            input.uploadFile{
                position:absolute;
                right:0px;
                top:0px;
                opacity:0;
                filter:alpha(opacity=0);
                cursor:pointer;
                width:276px;
                height:36px;
                overflow: hidden;
            }
            a.link{
                float:left;
                display:inline-block;
                padding:4px 16px;
                color:#fff;
                font:14px "Microsoft YaHei", Verdana, Geneva, sans-serif;
                cursor:pointer;
                line-height:28px;
                text-decoration:none;
            }
    </style>
</head>
<body>
    <div class="box">
         <a href="javascript:;"  class="link">浏览</a>
         <input ty pe="file" class="uploadFile"  onchange="getFile(this,‘copyFile‘)">
    </div>
</body>
</html>

CSS自定义上传文件按钮样式(兼容I6+)

标签:

原文地址:http://www.cnblogs.com/gyx19930120/p/4419993.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!