转自：http://zixuephp.net/article-85.html

思路：在一个div里面添加一个图片用作按钮再添加一个input file 文件上传，把文件上传按钮设置透明度为0，绝对定位覆盖在图片上，就实现了自定义上传图片按钮美化了。

html
  1. <div style="position:relative;">
  2. <img src="add.png" width="100"/>
  3. <input type="file" name="file" style="position:absolute;top:0px;left:12px;opacity:0;width:100px;height:100px;"/>
  4. </div>

css 文件上传按钮美化的更多相关文章

  1. css input[type=file] 样式美化，input上传按钮美化

    css input[type=file] 样式美化,input上传按钮美化 参考:http://www.haorooms.com/post/css_input_uploadmh

  2. CSS自定义文件上传按钮

    今天一同事问我文件上传按钮的问题,情况是这样的,他页面上有3个按钮,分为左中右三个,左边的位按钮甲,右边的位按钮乙,而中间的就是个文件选择按钮,情况大概是这个样子的: 两边的按钮都有了样式,但中间的选 ...

  3. CSS自定义文件上传按钮样式，兼容主流浏览器

    解决办法:使用text文本框及a链接模拟文件上传按钮,并且把文件上传按钮放在他们上面,并且文件上传按钮显示透明.​1.图片​​2. [代码][HTML]代码 <div class="b ...

  4. 表单多文件上传样式美化 && 支持选中文件后删除相关项

    开发中会经常涉及到文件上传的需求,根据业务不同的需求,有不同的文件上传情况. 有简单的单文件上传,有多文件上传,因浏览器原生的文件上传样式及功能的支持度不算太高,很多时候我们会对样式进行美化,对功能进 ...

  5. input上传按钮美化

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. input美化上传按钮美化

    今天工作需求碰到 样式改变上传按钮 效果: <a href="javascript:;" class="a-upload"> <input t ...

  7. Java实现文件上传-按钮弹出上传页面

    转自: https://blessht.iteye.com/blog/1405057 最近自己在做一个小系统玩的时候涉及到了文件的上传,于是在网上找到Java上传文件的方案,最后确定使用common- ...

  8. 使用ajax发送文件的三种方式及预览图片的方法,上传按钮美化

    后端代码 def upload(request): if request.method == "GET": return render(request,'upload.html') ...

  9. 文件上传按钮input[type="file"]按钮美化时在IE8中的bug【兼容至IE8】

    首先看一下完成后的效果,鼠标移入可改变为手指的效果. 在此就不加图标了 <label class="file-upload"> <span>上传附件< ...

随机推荐

  1. Spring中AOP的初窥和入门小案例

    AOP:面向切面编程 AOP的主要作用:是为了程序员更好的关注"业务",专心"做事" 加上双引号的意思:所谓业务,是指他的核心,各行业中需要处理的核心事务,核心 ...

  2. Android国际化-图片国际化和文本字符国际化

    注意: 1.是在res目录下面,新建文件夹 2.需要国际化的文本资源和图片资源名称是一样的 图片国际化 默认:drawable-xhdpi 中文简体:drawable-zh-rCN-xhdpi(或者不 ...

  3. thinkphp中composer方式安装的插件如何使用

    thinkphp中composer方式安装的插件如何使用 一.总结 一句话总结:任何东西都是可以百度或者google搜到的,要自己先想怎么解决,解决不出来迅速百度,不要自己臆断 1.在tp5框架的什么 ...

  4. GridRegionAdapter（slivelight）

    原地址:http://www.xuebuyuan.com/68722.html Prism学习之SilverlightWindowRegionAdapter[0评] 文章作者: healer 文章分类 ...

  5. 论文笔记 — L2-Net: Deep Learning of Discriminative Patch Descriptor in Euclidean Space

    论文: 本文主要贡献: 1.提出了一种新的采样策略,使网络在少数的epoch迭代中,接触百万量级的训练样本: 2.基于局部图像块匹配问题,强调度量描述子的相对距离: 3.在中间特征图上加入额外的监督: ...

  6. Java中常见的比较器的实现方法

    在Java中经常会涉及到对象数组的排序问题,那么就涉及到对象之间的比较问题. 通常对象之间的比较可以从两个方面去看: 第一个方面:对象的地址是否一样,也就是是否引用自同一个对象.这种方式可以直接使用& ...

  7. MySQL 大数据量修改表结构问题

    前言: 在系统正常运作一定时间后,随着市场.产品汪的需求不断变更,比较大的一些表结构面临不得不增加字段的方式来扩充满足业务需求:  而 MySQL 在体量上了千万.亿级别数据的时候,Alter Tab ...

  8. iOS-使用ALAssetsLibrary获取相册图片视频

    用ALAssetsLibrary获取相册图片视频 ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init]; [library enumera ...

  9. php中实现将姓名拆分为姓氏和名字

    之前有分享了用javascript在客户端进行姓名拆分的方法,后应项目需要,又用PHP实现了,贴出来 跟大家分享交流: /** * 把全名拆分为姓氏和名字 * @param string $fulln ...

  10. mysql 在Windows下自动备份

    1.一般备份方法主要为两种: 直接保存数据库data文件夹 mysqldump 用sql命令备份(文件存放目录必须存在) 首先cmd进入MySQL\bin,然后mysqldump --default- ...