zoukankan      html  css  js  c++  java
  • 只用css来美化的上传表单按钮(抄的迅雷的)

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>文件上传</title>
    <link href="css/reset.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    .wei_upload{ position:relative; border:1px solid #FFE6E6; overflow:hidden; background:#5DBB5D; display:inline-block; font-size:13px; margin:100px;padding:5px 10px; color:#fff; cursor:pointer;}
    .wei_upload:hover{ background:#F9C;}
    .wei_upload input{ opacity:0;filter:alpha(opacity=0); position:absolute; right:0; top:0; z-index:10;cursor:pointer; 100px; height:100px; visibility:hidden;}
    </style>

    </head>
    <body>
    <span class="wei_upload" id="wei_upload">
    <em>上传</em>
    <input type="file" />
    </span>
    </body>
    </html>
    <script type="text/javascript">
    window.onload=function(){
        var o=document.getElementById("wei_upload");
        var a=o.getElementsByTagName("input")[0];
        o.onclick=function(){
            a.click();    
        }
    }
    </script>

    最近公司有一个项目,需要制作各种表单美化的效果,发现表单美化还真是不好玩,为什么不用原生的呢,原生的结构啊效率啊什么的都是杠杠的呀,不懂

  • 相关阅读:
    PHP preg_replace_callback_array() 函数
    PHP preg_quote() 函数
    PHP preg_match() 函数
    SqlHelper工具类
    ArrayListd的长度问题
    事务
    Socket通信
    时间戳,产生随机数
    背景大小 | background-size (Backgrounds & Borders)
    背景图片位置 | background-position (Backgrounds & Borders)
  • 原文地址:https://www.cnblogs.com/busicu/p/3777184.html
Copyright © 2011-2022 走看看