input光标大小
最近在做项目忘记密码页面时,input光标大小需要统一。同时也需要兼容ie8浏览器。
总结如下:
IE:不管该行有没有文字,光标高度与font-size一致。
FF:该行有文字时,光标高度与font-size一致。该行无文字时,光标高度与input的height一致。
Chrome:该行无文字时,光标高度与line-height一致;该行有文字时,光标高度从input顶部到文字底部(这两种情况都是在有设定line-height的时候),如果没有line-height,则是与font-size一致。
解决的方案:
给input的height设定一个较小的高度,然后用padding去填充,基本上可以解决所有浏览器的问题
input{
height: 16px;
padding: 4px 0px;
font-size: 12px;
}
input光标大小的更多相关文章
- input光标高度问题
input输入框光标高度问题IE:不管该行有没有文字,光标高度与font-size大小一致 FF:该行没有文字时,光标大小与input的 height 大小一致:该行有文字时,光标大小与font-si ...
- input长度随输入内容动态变化 input光标定位在最右侧
<input type="text" onkeydown="this.onkeyup();" onkeyup="this.size=(this. ...
- input 光标在 chrome下不兼容 解决方案
input 光标在 chrome下不兼容 解决方案 height: 52px; line-height: normal; line-height:52px\9 .list li input[type= ...
- 隐藏input光标和输入内容方法
text-indent: -999em; // 隐藏input文字margin-left: -100%;// 隐藏input光标
- input光标位置
兼容谷歌火狐-input光标位置 input框在没有添加任何效果的情况下,输入文字后光标始终在最后的位置,谷歌||火狐效果一样 但是在给input加入点击事件后 谷歌:input框插入文字后,光标会自 ...
- IOS中input光标跑偏问题的解决方法
ios端兼容input光标高度处理 在最近的项目中遇到一个问题,input输入框光标,在安卓手机上显示没有问题,但是在苹果手机上 当点击输入的时候,光标的高度和父盒子的高度一样.造成的原因就是给父盒子 ...
- 关于调整input里面的输入光标大小
input输入框用一个背景图模拟,设置height和line-height一样的高度,使里面的输入文字能够居中, 在FF下出现的情况是:点击input时,输入光标其实上跟input的height一样高 ...
- ie 下input光标位置垂直不居中问题
input输入框用一个背景图模拟,设置height和line-height一样的高度,使里面的输入文字能够居中, 在FF下出现的情况是:点击input时,输入光标其实上跟input的height一样高 ...
- 苹果手机iOS11中fixed弹出框中input光标错位问题
最近遇到了一个移动前端的BUG:手机弹出框中的输入框focus时光标可能会错位. 刚开始时我完全不知道错误原因是什么,在电脑上调试时完全没有问题,手机上出现问题时也没有找到规律.后来在网上搜索了大量的 ...
随机推荐
- Maven私服(Repository Manager) - Nexus安装和使用(详细过程)
Maven私服的安装和使用. (注:原创文章,引用请注明来自Clement-Xu的博客!) Maven私服(即Repository Manager)的主要作用: 减少从远方仓库下载的次数,节省带宽.提 ...
- dedecms模板中 if else怎么写
在制作dedecms模板时,有时需要使用IF ELSE判断语句,但是dedecms模板中是无法使用使用IF语句的,否则会报错. 那么如何在dedecms模板中使用 if else呢?这就需要我们多走 ...
- redis主从同步配置
主服务器无需操作,从服务器 SLAVEOF 主服务器IP 端口 即可. 断开主从,执行 SLAVEOF NO ONE 即可. 同事和我在内网配置了连内网测试的服务器可以执行,但是连对方的不行,开始以为 ...
- npm install 错误 安装 chromedriver 失败的解决办法
npm 安装 chromedriver 失败的解决办法npm 安装 chromedriver 时,偶尔会出错,错误提示类似于:npm ERR! chromedriver@2.35.0 install: ...
- 启动Mysql数据库报错误:-bash: ./start.sh: Permission denied
linux下安装好Mysql数据库后,输入启动命令: cd /home/homework/mysql && ./start.sh 回车后报如下错误: 原因是:该文件未有相关执行权限 解 ...
- Palindromic Matrix
Palindromic Matrix time limit per test 2 seconds memory limit per test 256 megabytes input standard ...
- switch(值){ 开始case 值: 闭合break; }
switch ($goods['leixing']) { case 1: $data['type'] = 1; $data['orderid'] = 'PT' . rand(000000, 99999 ...
- 学习完HTML后的5大测试题----9.18
考试题目 第一题: 布局出该效果 提示:使用DIV的border样式,调整边框粗细出现该效果,保留上边框,其它三个方向的边框需设置:border-left:100px solid transpar ...
- phpredis中文开发文档
刚好要用看了网上翻译版本都是2011,2012年的,随手翻译一下新版 2017年10月28日23:48:08 使用方法 : Ctrl+F 官方英文版 https://github.com/phpred ...
- WebService,ESB笔记
一.WebService是什么? WebService,是RPC的一样实现方式. RPC(Remote Procedure Call Protocol)--远程过程调用协议,它是一种通过网络从远程计算 ...