自定义input file 属性
<label class="input">
<input title="浏览文件" type="file" />浏览…
</label>
<style type="text/css">
.input{display: inline-block;
width: 140px;
height: 50px;
line-height: 50px;
text-align: center;
overflow: hidden;
position: relative;
background-color: #00a1cb;
color: #fafafa;
text-shadow:0 -1px 0 rgba(0,0,0,0.25);
border-radius: 1px;
transition:background .3s;
-webkit-transition:background .3s}/*自定义外框样式*/
.input:hover{background-color: #00b5e5}/*鼠标经过样式*/
.input input{opacity: 0;filter:alpha(opacity=0);
font-size: 100px;
position: absolute;
top: 0;
right: 0} /*隐藏默认控件样式*/
</style>
自定义input file 属性的更多相关文章
- 自定义input file样式
自定义input file样式:一般都是通过隐藏input,通过定义label来实现.这种做法要注意的是label的for属性要指定input对应的id; <!DOCTYPE html> ...
- input:file属性
1.accept 只能选择png和gif图片 <input id="fileId1" type="file" accept="image/png ...
- 巧妙利用label标签实现input file上传文件自定义样式
提到上传文件,一般会想到用input file属性来实现,简单便捷,一行代码即可 但input file原生提供的默认样式大多情况下都不符合需求,且在不同浏览器上呈现的样式也不尽相同 我们往 ...
- HTML5的 input:file上传类型控制
一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的文件MIME类型,多个MIME类型用英文逗号分开,常用的MIME类型见下表. multiple:是否可以选择多个文 ...
- 在HTML5的 input:file 上传文件类型控制 遇到的问题
1.input:file 属性的介绍 先瞅代码吧 <form> <input type="file" name="pic" accept=& ...
- HTML5的 input:file上传 以及 类型控制
以HTML5的文件上传API 如下demo代码在.html文件打开即可: !DOCTYPE html> <html lang="zh_cn"> <head& ...
- HTML5: input:file上传类型控制
ylbtech-HTML5: input:file上传类型控制 1. 一.input:file 属性返回顶部 一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的 ...
- HTML5的 input:file上传类型控制(转载)
http://www.haorooms.com/post/input_file_leixing HTML5的 input:file上传类型控制 2014年8月29日 66352次浏览 一.input: ...
- 在webapp上使用input:file, 指定capture属性调用默许相机,摄像,录音功能
## 在webapp上使用input:file, 指定capture属性调用默认相机,摄像,录音功能 在iOS6下开发webapp,使用inputz之file,很有用 <input type=& ...
随机推荐
- java.util.Date转java.sql.Date丢失时间问题
java.sql.Date 只存储日期数据不存储时间数据// 会丢失时间数据preparedStatement.setDate(1, new java.sql.Date(date.getTime()) ...
- 一些关于Block, ARC, GCD的总结
基础解释不做.基础的东西链接如下: 1. Block:https://developer.apple.com/library/ios/documentation/Cocoa/Conceptual/Bl ...
- 以Outlook样式分组和排列数据项
转载:http://www.cnblogs.com/peterzb/archive/2009/05/29/1491781.html OutlookGrid:以Outlook样式分组和排列数据项 (这里 ...
- memcached Logging
For reasons now relegated to history, Spy has its own logging implementation. However, it is compati ...
- 语义化的HTML
div:division(分开, 分割, 区分,分配, 分界线),标签可以把文档分割为独立的.不同的部分.作为块级元素的代表,因为没有固定的格式表现,目前滥用情况最严重.ul:Unordered Li ...
- MySQL中你肯定不知道的int隐情
MySQL中定义id字段为int类型,但是你知道它内部是什么玩意吗? 1.如果定义int类型,但是不声明长度,系统默认为11个长度(这个大家都知道): 2.如果指定长度小于11,实际上系统还是默认为1 ...
- java面试笔试试题http://www.jobui.com/mianshiti/it/java/6827/
一.判断题(每题1分,共10分)1.Applet是一种特殊的Panel,它是Java Applet程序的最外层容器.()2.Java的源代码中定义几个类,编译结果就生成几个以.class为后缀的字节码 ...
- MySQL 多会话之间更新数据的小实例
1:创建一个实验表 mysql> use test; mysql> CREATE TABLE t -> (id int(11) NOT NULL DEFAULT 0, -> n ...
- 使用SurfaceView和MediaPlayer实现视频做为背景
场景:像我们在Uber应用开场,看到一一段视频作为開始.这样子让用户非常快投入应用使用的场景中去,这样的以视频作为开场的应用,我们是不是认为非常高大上呢,哈哈,事实上是使用了SerfaceView去载 ...
- SIP入门(二):建立SIPserver
在我的上一篇文章中已经介绍怎样通过SIP软电话直接通话,可是假设须要支持很多其它用户互相通话,同一时候基于安全考虑,须要对用户帐户登录进行验证控制,这些情况下就须要建立SIPserver. SIPse ...