css3自定义上传图片输入框的方法

代码如下
<pre>
<form class="form1">
<img src="/kelatoupiao/images/p6/p6_wz1.png" alt="" class="p6_wz1">
<input type="file" name="file_temporaryImage" onchange="TemporaryMedia();"/>
</form>

.p6_wz1 {
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;

}

.form1 {
width: 2.4rem;
height: 2.4rem;
float: left;
margin-left: 0.43rem;
margin-top: 0.03rem;
position: relative;

}

.form1 input {
width: 100%;
height: 100%;
display: block;
position: absolute;
left: 0px;
top: 0px;
opacity: 0;
}
</pre>

ps:原理就是input设置透明度0 然后放最上面 图片放下面

css3自定义上传图片输入框的方法的更多相关文章

  1. css3 自定义字体的使用方法

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  2. css3软键盘不盖住输入框的方法

    css3软键盘不盖住输入框的方法 弹出软键盘的时候 最外面的容器高度就发生了变化 要减去软键盘高度了<pre>var bodyheight bodyheight = $('body').h ...

  3. Android自定义View的实现方法,带你一步步深入了解View(四)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到第四篇了,回 ...

  4. dedecms为后台自定义菜单的完整方法

    dedecms为后台自定义菜单的完整方法 品味人生 dedeCMS 围观7330次 18 条评论 编辑日期:2014-06-14 字体:大 中 小   最近在给客户定制一个企业网站,客户要求使用ded ...

  5. 自定义HttpMessageHandler实现HTTP方法的重写

    自定义HttpMessageHandler实现HTTP方法的重写

  6. 【转】Android自定义View的实现方法,带你一步步深入了解View(四)

    原文网址: 转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到 ...

  7. CSS3自定义滚动条样式

    原文地址:→传送门 写在前面 滚动条是个很常见的东东,不过某些浏览器自带的滚动条确实不太好看啊,下面可以作为学习,探讨下自定义滚动条的实现,这样你的滚动条就可以美美的啦.但是,也只能玩玩,因为只针对w ...

  8. Collections.sort自定义排序的使用方法

    Collections.sort自定义排序的使用方法 总结:Collections可以对List进行排序:如果想对Map进行排序,可以将Map转化成List,进行排序: public static v ...

  9. redis结合自定义注解实现基于方法的注解缓存,及托底缓存的实现

    本次分享如何使用redis结合自定义注解实现基于方法的注解缓存,及托底缓存的实现思路    现在的互联网公司大多数都是以Redis作为缓存,使用缓存的优点就不赘述了,写这篇文章的目的就是想帮助同学们如 ...

随机推荐

  1. Git分支和版本回退

    一.分支 1.分支简单介绍 简单使用: 可以将git branch new_branch和git checkout new_branch两个命令合并成一个命令: git checkout -b new ...

  2. jenkins 配置ssh remotes 报Failed to authenticate with public key

    问题:jenkins配置ssh远程连接时候报 ERROR: Failed to authenticate with public key com.jcraft.jsch.JSchException: ...

  3. java hibnernet测试@test 时不提交保存的事务

    开始保存时不能提交数据报错: org.hibernate.HibernateException: Could not obtain transaction-synchronized Session f ...

  4. 基于windows 10打造的kali工具集

    基于windows 10打造的kali工具集.iso,适合于习惯使用windows的安全从业者.if you like it,please touch star! 作为安全从业主,Kali都是必备工具 ...

  5. Promise 封装 ajax

    Promise 封装ajax 成链式结构: var url = 'http'; function(method, url) { return new Promise(function(res, ret ...

  6. 阻止鼠标右键和F5刷新

    //禁止刷新的事件发生 document.onkeydown = function(){ if(event.keyCode==116){ event.keyCode = 0; event.cancel ...

  7. maven 学习---Maven教程

    Apache Maven是一个软件项目管理和综合工具.基于项目对象模型(POM)的概念,Maven可以从一个中心资料片管理项目构建,报告和文件. 本教程将介绍如何使用Maven在Java开发,或任何其 ...

  8. windows10删除多出的oem分区

    某次windows升级后,磁盘管理里新出现一个500多M的OEM分区 其实系统里本来就有一个OEM分区是第一个分区,大小499M,可能因为这个分区太小,系统就又新建一个 因为在windows10分区后 ...

  9. JavaScript 弹出框

    JavaScript 有三种类型的弹出框:警告框.确认框和提示框. 警告框 如果要确保信息传递给用户,通常会使用警告框. 当警告框弹出时,用户将需要单击“确定”来继续. 语法 window.alert ...

  10. JMETER 使用断言

    断言概念 断言就是在执行某个请求后,根据返回的结果,判断返回是否正确,如果不正确,则表示事务失败. 添加断言 启动流程时返回的数据是一个 json对象,结构为 {success:true,msg:&q ...