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. vscode+flutter+win10搭建问题记录

    1.下载安装vscode.flutter sdk.安装vscode相关插件.android sdk,这些网上有教程,比如https://blog.csdn.net/SVNzK/article/deta ...

  2. python 排序 插入排序与希尔排序

    希尔排序是插入排序的升级版,先来了解插入排序 插入排序 算法思想: 插入排序再面对几乎已经有序的数据效率非常高,可以达到线性排序的效率 将数组元素插入已经有序的部分中,具体的过程是在有序的部分中通过比 ...

  3. vue单页面应用中动态修改title

    https://www.jianshu.com/p/b980725b62e8 https://www.npmjs.com/package/vue-wechat-title 详细信息查看:vue-wea ...

  4. jdbc预编译实现方式

    jdbc预编译可以有两种方式: 方式一.jdbc自己实现的预编译,就是做一下特殊字符处理来防SQL注入,看PreparedStatement源码就可以了. public static void mai ...

  5. CentOS7升级内核kernel5.0

    升级过程: 原系统:CentOS7.3 [root@my-e450 ~]# uname -r3.10.0-514.el7.x86_64 安装必需的软件包: # yum update# yum inst ...

  6. 【转】Linux内存管理(最透彻的一篇)

    摘要:本章首先以应用程序开发者的角度审视Linux的进程内存管理,在此基础上逐步深入到内核中讨论系统物理内存管理和内核内存的使用方法.力求从外到内.水到渠成地引导网友分析Linux的内存管理与使用.在 ...

  7. 详解数据库引擎与SQL语句增删改查(非常详细,带例)

    数据库系统(DBMS): 专门负责数据管理的工具.增加数据.创建索引.建立索引之间的关联关系.更新索引...... 连接器:PHP要访问MySQL,可以通过API访问,也可以通过PHP的驱动,而那个驱 ...

  8. yum lockfile is held by another process

    使用yum安装软件报错 yum lockfile is held by another process 解决方法 rm -f /var/run/yum.pid

  9. 网传英特尔酷睿第十代桌面处理器(Comet Lake 14nm)规格

    自从农企(AMD)2016年开始崛起时,牙膏厂(英特尔)就开始发力,陆续两代推出性价比颇高的桌面处理器, 第八代.第九代酷睿桌面处理器相当的给力,而第十代酷睿桌面处理器会很猛啊,据传从酷睿i3到酷睿i ...

  10. 06-cmake语法-include

    用来载入CMakeLists.txt文件,也用于载入预定义的cmake模块. include(cmake/OpenCVMinDepVersions.cmake) .cmake 是一个文本,定义了一个模 ...