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库时免不了会用到各种上传文件,那么默认的上传文件样式无法达到项目的要求,因此重写(修改)上传文件样式是必然的,下面的效果是最近项目中自己写的一个效果,写出来做个记录方便以后使用 ...
随机推荐
- 《A First Course in Probability》-chaper5-连续型随机变量-随机变量函数的期望
在关于离散型随机变量函数的期望的讨论中,我们很容易就得到了如下的等式: 那么推广到连续型随机变量,是否也存在类似的规律呢? 即对于连续型随机变量函数的期望,有: 这里给出一个局部的证明过程,完整的证明 ...
- centos下apache thrift的安装
参考:http://running.iteye.com/blog/1983463 thrift-0.9.0安装 最好切换到root用户操作,避免不必要的麻烦. 进行例子程序tutorial目录下,通 ...
- C#在ASP.NET4.5框架下的首次网页应用
运行效果预览: 先看实践应用要求: 1.编写一个函数,用于计算1!+2!+3!+4!+5!,在控制台或页面输出运行结果. 2.在控制台或页面输出九九乘法表. 3.输入10个以内的整数,输出该组整数的降 ...
- 【Android - MD】之TextInputLayout的使用
TextInputLayout是Android 5.0新特性--Material Design中的一个布局控件,主要用来嵌套EditText,实现数据输入时的一些效果,如: 当输入框获取焦点时,输入提 ...
- 通过 INotifyPropertyChanged 实现观察者模式
INotifyPropertyChanged 它的作用:向客户端发出某一属性值已更改的通知. 当属性改变时,它可以通知客户端,并进行界面数据更新.而我们不用写很多复杂的代码来更新界面数据,这样可以做到 ...
- SICP 习题 (1.8) 解题总结
SICP 习题1.8需要我们做的是按照牛顿法求平方根的方法做一个求立方根的过程. 所以说书中讲牛顿法求平方根的内容还是要好好理解,不然后面这几道题做起来就比较困难. 反过来,如果理解了牛顿法求平方根的 ...
- Fragment的懒加载
我们在做应用开发的时候,一个Activity里面可能会以viewpager(或其他容器)与多个Fragment来组合使用,而如果每个fragment都需要去加载数据,或从本地加载,或从网络加载,那么在 ...
- 从高德 SDK 学习 Android 动态加载资源
前不久跑去折腾高德 SDK 中的 HUD 功能,相信用过该功能的用户都知道 HUD 界面上的导航转向图标是动态变化的.从高德官方导航 API 文档中 AMapNaviGuide 类的描述可知,导航转向 ...
- JAVA 原始国际化例子
import java.text.MessageFormat; import java.util.Locale; import java.util.ResourceBundle; public cla ...
- linux下杀死进程(kill)的N种方法 【转】
转自 http://blog.csdn.net/andy572633/article/details/7211546 首先,用ps查看进程,方法如下: $ ps -ef ……smx 182 ...