大家都知道input的type=file控件默认样式是不能修改的

可以通过一个小技巧处理下

html:

<a href="javascript:;" class="go_upload">上传游戏安装包
<input class="upload_input" type="file" value="上传游戏安装包"/>
</a>

css:

.go_upload{
position: relative;
display: inline-block;
background: #3ca4fd;
padding: 13px 103px;
overflow: hidden;
color: #ffffff;
text-decoration: none;
text-indent: 0;
line-height: 20px;
}
.upload_input{
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}

美化 input type=file控件的更多相关文章

  1. 页面加载完成触发input[type="file"]控件问题

    由于浏览器厂家的限制,不同的浏览器不开放页面加载完成就允许触发input[type="file"]控件 测试 Chrome .火狐 .IE .微信客户端QQ =>桌面端: C ...

  2. input的file 控件及美化

    在一些网站进行上传时,当单击了“浏览”按钮之后会弹出[选择文件]的对话框.想要实现这一功能,用input的file控件来实现就好啦~ <!doctype html> <html la ...

  3. 美化type="file"控件

    对于type="file"而言是一个不大好看的控件.如果不美化他一下,总感觉自己的网站有些缺乏了美感 上代码: <!DOCTYPE html> <html> ...

  4. Jquery给input[type=radio] 控件赋值

    setobject: function (data, scope, win) { //data jsoon数据, scope,一般为form的id,win 窗口对象,如果在当前window win=n ...

  5. CSS美化 input type=file 兼容各个浏览器(转)

    HTML代码: <FORM> <A class=btn_addPic href="javascript:void(0);"><SPAN>< ...

  6. input type=file 标签禁止让用户手动输入

    常规的Web应用程序中涉及到文件上传的部分都不可避免地会使用到<input type="file"/>控件,在上传文件的时候通过点击“浏览”按钮,在弹出的文件选择对话框 ...

  7. INPUT[type=file]的change事件不触发问题

    在网页上要操作文件通常会使用INPUT[type=file]控件,但这个控件的设计很蛋疼.它不像其它编程语言中文件选择后会触发一个事件,只是让上面的文字改变,而这个改变可能会触发change事件而已. ...

  8. 【原创】js中input type=file的一些问题

    1.介绍 在开发中,文件上传必不可少,input[type=file] 是常用的上传标签,但是它长得又丑.浏览的字样不能换,但是他长得到底有多丑呢.我们来看看在不同浏览器里的样子吧. <inpu ...

  9. input[type="file"]的样式以及文件名的显示

    如何美化input[type="file"] 基本思路是: (1)首先在 input 外层套一个 div : (2)将 div 和 input 设置为一样大小(width和heig ...

随机推荐

  1. mysql 基本使用

    SQL分类 -------------------数据库------------ 创建数据库  create database xxx; 查询所有的数据库 show databases; 查询当前数据 ...

  2. org.hibernate.QueryException: could not resolve property: address of:

    Hibernate: select count(*) as y0_ from test.course this_ org.hibernate.QueryException: could not res ...

  3. 扩展VirtualBox虚拟机磁盘容量

    1. 在cmd命令行下进入VirtualBox的安装目录,使用“VBoxManage list hdds”命令,找到需要修改磁盘容量的虚拟机的img路径或UUID: VirtualBox安装目录> ...

  4. MyIsam与InnoDB主要区别

    MyIsam与InnoDB主要有以下4点大的区别,缓存机制,事物支持,锁定实现,数据物理存储方式(包括索引和数据). 1.缓存机制 myisam 仅仅缓存索引,不会缓存实际数据信息,他会将这一工作交给 ...

  5. struts2 + jquery 开发环境下的ajax构建方法(action写法 + struts.xml配置 + js调用代码)

    1.action写法 public class RegisterAction extends ActionSupport { private InputStream inputStream; /** ...

  6. 《UNIX环境高级编程》笔记--线程的标识、创建和终止

    1.线程标识 就像每个进程都有一个进程ID一样,每个线程都有一个线程ID.进程ID在整个系统中是唯一的,但线程ID只在它所属的 进程环境中有效. 线程ID使用pthread_t数据类型来表示,实现的时 ...

  7. Windows2008 VPN登录

    上一章已经讲过Windows2008RT搭建VPN服务器搭建过程,接下来说一下win2008和win8的VPN登录 win8VPN连接过程 先说win2008的VPN登录过程.很简单: 打开网络和共享 ...

  8. MySQL read_only选项的作用

    1作用: 从字面意思上看就可以知道这个是把mysql设置为只读,但是这个只读只是针对一般用户而言的,对于root这种用super权限的用户read_only是没有用的. 2设置方式: set glob ...

  9. android select选择器 checkbox改外观,button按下状态

    android 可以用选择器.来加载视图.选择器里的选项也很多针对实际使用中用的几个进行描述. 1.button 的按下弹起改外观.选择器属性用 android:state_pressed   2.C ...

  10. 关于调用约定(cdecl、fastcall、、thiscall) 的一点知识(用汇编来解释)good

    函数调用规范   当高级语言函数被编译成机器码时,有一个问题就必须解决:因为CPU没有办法知道一个函数调用需要多少个.什么样的参数.即计算机不知道怎么给这个函数传递参数,传递参数的工作必须由函数调用者 ...