input file文件上传样式
<style>
.file-group {
position: relative;
width: 200px;
height: 80px;
border: 1px solid #ccc; /* 为了显示可见区域,非必须 */
overflow: hidden;
cursor: pointer;
line-height: 80px;
font-size: 16px;
text-align: center;
color: #fff;
background-color: #f50;
border-radius: 4px;
}
.file-group input {
position: absolute;
right: 0;
top: 0;
font-size: 300px;
opacity: 0;
filter: alpha(opacity=0);
cursor: pointer;
}
.file-group:hover {
background-color: #f60;
}
</style>
<div class="file-group">
<input type="file" name="" id="J_File">
选择文件
</div>
input file文件上传样式的更多相关文章
- input file 文件上传标签的样式美化
input file 文件上传标签的样式美化 将<input type="file">的透明度设置为0: <input type="file" ...
- js 实现 input file 文件上传
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&qu ...
- 修改input file 文件上传的样式
Web页面中,在需要上传文件时基本都会用到<input type="file">元素,它的默认样式: chrome下: IE下: 不管是上面哪种,样式都比较简单,和很多 ...
- PHP 多input file文件上传
前台html jquery代码 后台PHP处理 前台html <form id="form" method="post" enctype="mu ...
- input file 文件上传,js控制上传文件的大小和格式
文件上传一般是用jquery的uploadify,比较好用.后面会出文章介绍uploadify这个插件. 但是,有时候为了偷懒,直接就用input 的file进行文件和图片等的上传,input fil ...
- 更改file文件上传默认CSS样式
前言: 多数时候我们需要表单上传文件,如图片.但是浏览器默认的input[file]样式很不友好, 需要我们自己手动修改. 如图基于bootstrap布局的表单, 但file文件上传样式不敢恭维. & ...
- js 实现 input type="file" 文件上传示例代码
在开发中,文件上传必不可少但是它长得又丑.浏览的字样不能换,一般会让其隐藏点其他的标签(图片等)来时实现选择文件上传功能 在开发中,文件上传必不可少,<input type="file ...
- [置顶] js 实现 <input type="file" /> 文件上传
在开发中,文件上传必不可少,<input type="file" /> 是常用的上传标签,但是它长得又丑.浏览的字样不能换,我们一般会用让,<input type ...
- input type='file'文件上传自定义样式
使用场景: 在未使用UI库时免不了会用到各种上传文件,那么默认的上传文件样式无法达到项目的要求,因此重写(修改)上传文件样式是必然的,下面的效果是最近项目中自己写的一个效果,写出来做个记录方便以后使用 ...
随机推荐
- 《图解密码技术》-chaper1-概述
密码和信息安全常识: (1)不要使用保密的密码算法. (2)不要使用低强度密码算法. (3)密码一定会被破解. (4)密码只是信息安全的一部分.
- 机器学习算法库scikit-learn的安装
scikit-learn 是一个python实现的免费开源的机器学习算法包,从字面意思可知,science 代表科学,kit代表工具箱,直接翻译过来就是用于机器学习的科学计算包. 安装scikit-l ...
- nyoj 1022 合纵连横【并查集节点的删除】
合纵连横 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 乱世天下,诸侯割据.每个诸侯王都有一片自己的领土.但是不是所有的诸侯王都是安分守己的,实力强大的诸侯国会设法 ...
- poj 1287 Networking【最小生成树prime】
Networking Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 7321 Accepted: 3977 Descri ...
- Eclipse下Tomcat常用设置
Eclipse下Tomcat常用设置 1,Eclipse建立Tomcat服务 1.1 新建Server 首先这里是指,jee版的Eclipse.Eclipse是没有像MyEclipse那样集成Tomc ...
- android 50 进程优先级
程序在磁盘叫程序,程序加载到内存运行起来叫进程,优先级5个级别,内存不足的时候会杀掉低级别进程. Active Process:最上面用户可以操作的. Visible Process:可见进程,部分可 ...
- android 04 AbsoluteLayout
绝对布局:layout_x,layout_y:坐标精准定位 xml文件:不推荐使用 <AbsoluteLayout xmlns:android="http://schemas.andr ...
- TCP/IP(84) 详解
http://blog.csdn.net/zhangskd/article/category/873810
- 亲测PHP环境
一.安装Apache2.2.22→1.下载软件,点安装 2.填写dengguoxing.com www.dengguoxing.com(暂时不知道什么用)3.custom 个性化安装 更改路径即可 ...
- 用户输出表单处理php
php中的表单输入处理,我用两个文件,在linux输出: touch php_post1.html php_post1.php php_post1.html代码如下: <!doctype htm ...