<!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; width: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>

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

只用css来美化的上传表单按钮（抄的迅雷的）的更多相关文章

  1. 【Flask】 结合wtforms的文件上传表单

    表单中的文件上传 基本的表单渲染,表单类设置等等就不多说了,参看另一个文章即可.但是那篇文章里没有提到对于FileField,也就是上传文件的表单字段是如何处理,后端又是如何实现接受上传过来的文件的. ...

  2. bootstrap上传表单的时候上传的数据默认是0　一定要小心

    bootstrap上传表单的时候上传的数据默认是0 一定要小心

  3. ajax上传表单的俩种方式

    1.用h5对象上传表单(图片) var formData = new FormData(); formData.append("authenticity_token", '1212 ...

  4. 上传漏洞科普[1]-文件上传表单是Web安全主要威胁

    为了让最终用户将文件上传到您的网站,就像是给危及您的服务器的恶意用户打开了另一扇门.即便如此,在今天的现代互联网的Web应用程序,它是一种 常见的要求,因为它有助于提高您的业务效率.在Facebook ...

  5. 原生js封装ajax：传json，str，excel文件上传表单提交

    由于项目中需要在提交ajax前设置header信息,jquery的ajax实现不了,我们自己封装几个常用的ajax方法. jQuery的ajax普通封装 var ajaxFn = function(u ...

  6. html5图片异步上传/ 表单提交相关

    1 form 表单 get/post提交时候. action地址(或者啥ajax的url地址) 会涉及到跨域问题 常见跨域问题http://www.cnblogs.com/rainman/archiv ...

  7. jquery运用FormData结合Ajax异步上传表单，超实用

    首先创建一个formData,其中参数,就是你的form表单,jquery要加0,也可以用document.querySelector("form")得到 var formData ...

  8. layui 图片上传+表单提交+ Spring MVC

    Layui 的上传是最常用的, 不可或缺, 记录一下代码, 以后复制都能用!! 1.前端HTML: <div class="layui-form-item"> < ...

  9. 使用ajax上传表单（带文件）

    在使用form表单的时候上传文件+表单,会使得页面跳转,而在某些时候不希望跳转,只变化页面中的局部信息 通过查找资料,可以使用FormData进行ajax操作. FormData介绍:XMLHttpR ...

随机推荐

  1. 夺命雷公狗---DEDECMS----4快速入门之栏目页报错之快速解决

    我们dedecms是分3级或者3层的,如下图所示: 点击“玄幻小说”后发现出了错,如下图所示: 我们的dedecms是分3层的,他们分别是: 网站首页 网站的栏目页面(多级)--->栏目页面是需 ...

  2. 夺命雷公狗---TP商城----TP之样式和特效以及图片引入---2

    ---恢复内容开始--- 刚才见到笑脸了,那么下一步就到我们的shop目录下创建一个Admin的目录了,然后将Home目录里面的东西全部都拉进去即可 然后我们回到shop\Home\View目录下创建 ...

  3. 使用sudo执行命令的时候提示找不到命令

    事出有因, 源自使用源码编译 nginx , 在 /usr/local/sbin/ 目录下创建了nginx 启动的符号链接 , 执行 sudo nginx 的时候提示找不到命令, 但是使用普通用户身份 ...

  4. cvLoadImage函数解析 cvLoadImageM()函数

    1.函数原型:IplImage* cvLoadImage( const char* filename, int flags=CV_LOAD_IMAGE_COLOR ); filename :要被读入的 ...

  5. UIViewController卸载过程(ios6.0以后)

    在ios6.0以后,废除了viewWillUnload方法和viewDidUnload方法. 在ios6以后,当收到didReceiveMemoryWarning消息调用之后,程序会自动调用didRe ...

  6. struts2 笔记04 杂记

    流程: 1. StrutsPrepareAndExcuteFilter:StrutsPrepareAndExcuteFilter作为前端控制器,是整个Struts2的调度中心. 2. ActionMa ...

  7. selenium验证码处理

    在爬虫过程中经常遇到验证码,如何处理验证码就显得很重要 现在来说貌似没有完美的解决方案,很多都是通过第三方平台来实现验证码的验证 将获取的验证码的url发送到第三方平台,接收平台返回的验证码,貌似很简 ...

  8. VMWare联网

    VMWare提供了三种工作模式,它们是bridged(桥接模式).NAT(网络地址转换模式)和host-only(主机模式).  如果你想利用VMWare在局域网中新建一个独立的虚拟服务器,为局域网用 ...

  9. iOS证书申请详细流程

    一．事前准备 1.1 准备苹果帐号 首先您需要有一个苹果的开发者帐号,一个mac系统.如果没有帐号可以打开申请加入苹果的开发者计划.如何申请网上有详细的介绍,在此不多做介绍. 如果您已经有了一个帐号, ...

  10. 【python cookbook】【字符串与文本】6.以不区分大小写的方式对文本做查找和替换

    问题:以不区分大小写的方式对文本做查找和替换 解决方法:使用re模块,并对各种操作都添加上re.IGNORECASE标记 text='UPPER PYTHON,lower python,Mixed P ...