解决思路是把input 放在文字的上边，弄成透明的，这样在点文字时，实际是点击了input，这样就实现了文件的上传。

具体代码：

<style>

    #uploadImg{ font-size:12px; overflow:hidden; position:absolute}

    #file{ position:absolute; z-index:100; margin-left:-180px;      font-size:60px;opacity:0;filter:alpha(opacity=0); margin-top:-5px;}

</style>

<span id="uploadImg">

<input type="file" id="file" size="1" >

<a href="#">上传图片</a></span>

input上传按钮 文字修改办法的更多相关文章

  1. input上传按钮美化

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

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

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

  3. 兼容IE8的flash上传框架"uploadify"自定义上传按钮样式的办法

    (uploadify版本:3.2.1 ) 因为公司业务的原因,所做的项目需要兼容IE8,因此做的上传插件无奈选择的是基于flash的uploadify. 由于是基于flash的,所以使用过程中,难以给 ...

  4. input上传按钮的优化

    在使用input标签按钮的时候,<input type="file" value="" /> 显示很难看,怎么办? 使用label <li c ...

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

    <style>.file { position: relative; display: inline-block; background: #D0EEFF; border: 1px sol ...

  6. 一个漂亮的上传按钮input[type=file]

    ;;} <div class="input-group xj-file xj-panel-top"> <span class="input-group- ...

  7. 上传按钮样式优化 <input type="file" />

    <html><head><title>上传按钮样式优化</title> <style>.form-element-file-wapper { ...

  8. input美化上传按钮美化

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

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

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

随机推荐

  1. ACM Haffman编码

    Haffman编码 时间限制:1000 ms  |  内存限制:65535 KB 难度:3   描述 哈弗曼编码大家一定很熟悉吧(不熟悉也没关系,自己查去...).现在给你一串字符以及它们所对应的权值 ...

  2. 如何更改tableView cell的accessoryView位置,如何让首尾的Separator不显示

    一,如何更改tableView cell的accessoryView位置 1.实则是更改不了的,因此右边总会有一个小边距. 2.可以向 cell 的 contentView 中添加按钮放在右边,与 c ...

  3. JS引用另外JS文件的顺序问题。

    1.在a.js中可以引用b.js文件,这样就可以在网页中只引用a.js文件,从而可以使用a.js和b.js文件中的所有方法. 引用格式如下:document.write('<script typ ...

  4. 20145330《Java程序设计》第二次实验报告

    20145330<Java程序设计>第二次实验报告 实验二 Java面向对象程序设计 实验内容 1.初步掌握单元测试和TDD 2.理解并掌握面向对象三要素:封装.继承多态 3.初步掌握UM ...

  5. php 处理递归提成的方案

    好久没有写blog了,最近CRM项目中用到了递归提成的方案 CREATE TABLE `crm_proxy_bonux_rule` ( `id` ) NOT NULL AUTO_INCREMENT C ...

  6. （转）深入理解flash重绘

    深入理解Flash Player重绘 Flash Player 会以SWF内容的帧频速度来刷新需要变化的内容,而这个刷新的过程,我们通常称为“重绘(redraw)”,相信即便是初级的菜鸟也知道,只要使 ...

  7. jquery选择器实例说明

    选择器 实例 选取 * $("*") 所有元素 #id $("#lastname") id="lastname" 的元素 .class $( ...

  8. HDU2045/*HDU2604/*HDU2501/HDU2190 递推

    不容易系列之(3)-- LELE的RPG难题 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/O ...

  9. oracle 学习摘录

    (1)oracle插入回车换行符 SQL>insert into A t(t.name) values('aaaaa'||chr(10)||chr(13)||'ccccc'); 已创建 1 行. ...

  10. Flashback闪回技术小实验

    1闪回查询 2闪回删除 3闪回版本查询 4闪回事务查询 5闪回某张表   6闪回数据库