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. vertx 异步编程指南 step8-使用RxJava进行反应式编程

    vertx 异步编程指南 step8-使用RxJava进行反应式编程 2018-04-23 13:15:32 zyydecsdn 阅读数 1212  收藏 更多 分类专栏: vertx   到目前为止 ...

  2. python 变量作用域、闭包

    先看一个问题: 下面代码输出的结果是0,换句话说,这个fucn2虽然已经用global声明了variable1,但还是没有改变变量的值 def func1(): variable1=0 def fun ...

  3. input或者el-cascader的输入框随输入内容宽度自适应

    解决的思路是动态修改css的width 参考:https://blog.csdn.net/lianzhang861/article/details/84306139中的方法一, 如果是input,用o ...

  4. JVM:带你查看常见的问题,以及分析处方法

    一.前言 各位开发和运维同学,在项目实施落地的过程中,尤其是使用EDAS.DRDS.MQ这些java中间件时,肯定会遇到不少JAVA程序运行和JVM的问题.我结合过去遇到的各种各样的问题和实际处理经验 ...

  5. tkinter的trace()变动追踪

    tkinter的trace() 的参数w是写入追踪 from tkinter import * def callback(*args): xl.set(xE.get()) print("改变 ...

  6. Js判断flash是否被禁用,如果禁用并开启flash

    <script> function flashChecker() { ; //是否安装了flash ; //flash版本 if(document.all) { var swf = new ...

  7. 【开发笔记】- Grails框架定义一个不是数据库字段得属性

    实体类 class Book{ String name String author // myfiled 我不想他在数据库中生成book表的字段 String myfield } 添加声明 class ...

  8. elementui 自定义表头 renderHeader的写法 给增加el-tooltip的提示

    1.html <el-table-column prop="taxes" :render-header="renderHeader" width=&quo ...

  9. 如何做一个跨平台的游戏App?

    如何做一个跨平台的游戏App? iOS和安卓系统上的应用程序,根据提供的内容不同,按照开发方式和用户体验不同,可区分为app和游戏: 首先从开发方式不同来说明,app开发一般是用操作系统官方提供的开发 ...

  10. Android源码分析(十六)----adb shell 命令进行OTA升级

    一: 进入shell命令界面 adb shell 二:创建目录/cache/recovery mkdir /cache/recovery 如果系统中已有此目录,则会提示已存在. 三: 修改文件夹权限 ...