当input中的type值为file时,各浏览器的表现形式不同
如果想使各浏览器下的表现形式相同,需要对该input元素隐藏,然后再改元素下方添加标签。其html写法如下
<div class="input-file">
<input type="file" name="postImg" value="上传图片" id="upload" class="file-button">
<label class="file-button-img">上传封面</label>
</div>
css布局如下
.input-file{
display: inline-block;
height:50px;
width: 120px;
/*background-color: #56F06F;*/
text-align: center;
cursor: pointer;
position:relative;
}
.file-button{
opacity: 0;
position: absolute;
left:0;
top:0;
width:120px;
height: 50px;
}
.file-button-img{
line-height: 50px;
text-align: center;
display: inline-block;
margin-top: 5px;
color:#fff;
font-size: 18px;
width:100%;
height:100%;
display: block;
cursor:pointer;
background-color: #3EF5B1;
}
当input中的type值为file时,各浏览器的表现形式不同的更多相关文章
- js下读取input中的value值
很多人(包括我),总想像以前操作js一样,读取到input中的值:document.getElementById('').value; 结果事实证明这样读到得是null. eval(document. ...
- 【Python】如何取到input中的value值?
练习:取到下方链接下所有海贼王的下载链接. # coding=utf-8 from selenium import webdriver from time import sleep import ke ...
- js无法监听input中js改变值的变化
$(input).on('change',function(){ }) 当使用$(input).val('...');不会触发它的change事件 解决办法一:在改变它的值后,手动触发input的ch ...
- MyBatis SQL配置文件中使用#{}取值为null时却不报错的解决方案。
原因是因为#{kh_id} 这个参数名为小写,我之前写成了大写{#KH_ID}所以取不到值
- 笔记:HTML5中input元素新增的type值
在HTML5中,input元素的type值增加了不少,使input的功能强大了很多. 但在各大浏览器中并不是所有的type值都支持. 以下是比较有用.并且浏览器支持的稍好一些的值: type=colo ...
- 实现滑动条与表单中的input中的value交互
最近在写一个考试系统的项目,遇到一些比较有意思的小知识,在这里分享给大家 下面是一个滑动条与input中的value值的交互,即滑动条的颜色会跟随给定input的value值实时变化,虽然表单中的ra ...
- input中autocomplete属性
autocomplete="off":表示刷新页面时,input中的value值清空 <input type="text" id="q" ...
- python3 提取http请求response中的某个值
在使用python3 request做接口测试的时候,想获取response的json中的某个值做断言时,发现request好像没有相关的方法 所以只好自己找写一个了.在我看来,json就是一个字典, ...
- 你知道JavaScript中的结果值是什么吗?
你知道JavaScript中的每条语句.甚至表达式都有一个结果值吗? 当你在浏览器中测试代码时,经常会在控制台的输出结果的最后面多出一条,大部分为undefined,这个undefined就是一个结果 ...
随机推荐
- 解决git中upstream丢失问题Your branch is based on 'origin/xxxx', but the upstream is gone.
转自 https://blog.csdn.net/limengke123/article/details/77850134
- Node.js 薄荷网爬取
Node.js:是一个基于前端的服务器,主要的特点:单线程,异步I/O(对这个没有了解,开发起来真的会踩很多坑),事件驱动 前言:本人主要是一个以使用.Net平台下的语言,进行开发的一个菜鸡,之前面试 ...
- 红黑树(red-black tree)实现记录
https://github.com/xieqing/red-black-tree A Red-black Tree Implementation In C There are several cho ...
- MyCP(课下作业,必做)- 20175218
MyCP(课下作业,必做) 1.任务详情 编写MyCP.java 实现类似Linux下cp XXX1 XXX2的功能,要求MyCP支持两个参数: java MyCP -tx XXX1.txt XXX2 ...
- bootstrap模态框手动关闭遮盖层不消失
模态框中 加载了一个子页面 子页面中调教表单之后想根据执行结果手动关闭模态框,最初尝试了以下几种方案: 1.$("#myModal").modal('hide');//模态框关闭 ...
- Unity3D 物体移动方法总结
1. 简介 在Unity3D中,有多种方式可以改变物体的坐标,实现移动的目的,其本质是每帧修改物体的position. 2. 通过Transform组件移动物体 Transform 组件用于描述物体在 ...
- layui---十分适用于PC端后台的框架
1.关闭当前页面: top.$(".layui-tab-title").find("li.layui-this>i").click(); 2.调用指定ID ...
- Java创建对象的初始化顺序
1. 初始化块 初始化块通常写在类的构造方法之前,由花括号括起来,通常包含对成员属性进行初始化的语句: 初始化块分为instance初始化块和static初始化块,初始化块在构造方法执行之前被执行: ...
- 4.Redis客户端
4.Redis客户端4.1 客户端通信协议4.2 Java客户端Jedis4.2.1 获取Jedis4.2.2 Jedis的基本使用方法4.2.3 Jedis连接池的使用方法4.2.4 Redis中P ...
- MySQL实现阶段累加的sql写法 ,eq:统计余额
最近项目碰到一个新的需求,统计每日充值/消费之后的余额.对于这种需求,其实也很简单,只需要在每次充值/消费后,计算下余额,然后保存下来就可以了.但是对于这种需求,一条sql就能搞定,都不需要做冗余字段 ...