如何更好地控制input输入框的高度
浏览器
|
height + padding-top + padding-bottom + border-top-width + border-bottom-width
|
IE6(xp)
|
21 + 2 + 1 + 2 + 2 = 28
|
IE7(xp)
|
21 + 2 + 1 + 2 + 2 = 28
|
IE8(win7)
|
21 + 2 + 1 + 2 + 2 = 28
|
Firefox 3.5(xp)
|
21 + 2 + 1 + 2 + 2 = 28
|
Firefox 3.5(win7)
|
23 + 2 + 1 + 1 + 1 = 28
|
Firefox 3.5(mac 10.6.2)
|
19 + 2 + 1 + 3 + 3 = 28
|
Firefox 3.5(ubuntu 10.04)
|
19 + 2 + 1 + 3 + 3 = 28
|
Chrome 5(xp)
|
21 + 2 + 1 + 2 + 2 = 28
|
Chrome 5(win7)
|
21 + 2 + 1 + 2 + 2 = 28
|
Chrome 5(mac 10.6.2)
|
21 + 2 + 1 + 2 + 2 = 28
|
Chrome 5(ubuntu 10.04)
|
21 + 2 + 1 + 2 + 2 = 28
|
浏览器
|
height + padding-top + padding-bottom + border-top-width + border-bottom-width
|
IE6(xp)
|
28 + 2 + 1 + 2 + 2 = 35
|
IE7(xp)
|
28 + 2 + 1 + 2 + 2 = 35
|
IE8(win7)
|
28 + 2 + 1 + 2 + 2 = 35
|
Firefox 3.5(xp)
|
28 + 2 + 1 + 2 + 2 = 35
|
Firefox 3.5(win7)
|
28 + 2 + 1 + 1 + 1 = 32
|
Firefox 3.5(mac 10.6.2)
|
28 + 2 + 1 + 3 + 3 = 37
|
Firefox 3.5(ubuntu 10.04)
|
28 + 2 + 1 + 3 + 3 = 37
|
Chrome 5(xp)
|
28 + 2 + 1 + 2 + 2 = 35
|
Chrome 5(win7)
|
28 + 2 + 1 + 2 + 2 = 35
|
Chrome 5(mac 10.6.2)
|
28 + 2 + 1 + 2 + 2 = 35
|
Chrome 5(ubuntu 10.04)
|
28 + 2 + 1 + 2 + 2 = 35
|
浏览器
|
height + padding-top + padding-bottom + border-top-width + border-bottom-width
|
IE6(xp)
|
18 + 3 + 3 + 2 + 2 = 28
|
IE7(xp)
|
18 + 3 + 3 + 2 + 2 = 28
|
IE8(win7)
|
18 + 3 + 3 + 2 + 2 = 28
|
Firefox 3.5(xp)
|
19 + 3 + 3 + 2 + 2 = 29
|
Firefox 3.5(win7)
|
19 + 3 + 3 + 1 + 1 = 27
|
Firefox 3.5(mac 10.6.2)
|
20 + 3 + 3 + 3 + 3 = 32
|
Firefox 3.5(ubuntu 10.04)
|
19 + 3 + 3 + 3 + 3 = 31
|
Chrome 5(xp)
|
19 + 3 + 3 + 2 + 2 = 29
|
Chrome 5(win7)
|
19 + 3 + 3 + 2 + 2 = 29
|
Chrome 5(mac 10.6.2)
|
18 + 3 + 3 + 2 + 2 = 28
|
Chrome 5(ubuntu 10.04)
|
19 + 3 + 3 + 2 + 2 = 29
|
浏览器
|
height
|
IE6(xp)
|
16
|
IE7(xp)
|
16
|
IE8(win7)
|
16
|
Firefox 3.5(xp)
|
16
|
Firefox 3.5(win7)
|
16
|
Firefox 3.5(mac 10.6.2)
|
16
|
Firefox 3.5(ubuntu 10.04)
|
16
|
Chrome 5(xp)
|
16
|
Chrome 5(win7)
|
16
|
Chrome 5(mac 10.6.2)
|
16
|
Chrome 5(ubuntu 10.04)
|
16
|
Browser
|
Lowest Version
|
Support of
|
Internet Explorer
|
8.0
|
box-sizing
|
Firefox (Gecko)
|
1.0 (1.0)
|
-moz-box-sizing
|
Opera
|
7.0
|
box-sizing
|
Safari (WebKit)
|
3.0 (522)
|
-webkit-box-sizing
|
转载于:https://blog.51cto.com/baidutech/744778
如何更好地控制input输入框的高度相关推荐
- JavaScript控制input输入框的required属性值
JavaScript控制input输入框的required属性值 当我们在勾选上一个复选框之后,希望该选项的输入框成为必填项时,那么将会用到required这个属性 在HTML中,required为属 ...
- 控制input输入框光标的位置
一:理解input, textarea元素在标准浏览器下两个属性selectionStart, selectionEnd. selectionStart: 该属性的含义是 选区开始的位置: selec ...
- 控制 input 输入框不能输入中文,即不能在输入框中使用输入法
设置输入框的样式,代码如下 <span style="font-size:18px;"><input type = "text" id = & ...
- vue实现input输入框控制最多输入一位小数
vue实现input输入框控制最多输入一位小数, 直接在校验规则中写上js正则表达式就行,表达式如下: /^(\d+\.\d{1,1}|\d+)$/
- 解决手机端微信公众号内input输入框获取焦点后,底部导航栏显示在输入法软键盘上面的问题
今天遇到在微信公众号中打开网站,input 输入框和textarea输入框获取焦点后,弹出输入法键盘,将底部的导航栏"顶到"输入法键盘上面的问题,看着非常shit! 直接上代码看效 ...
- js手机键盘遮挡_iphone手机微信页面软键盘遮挡input输入框解决方法
现象描述:iphone手机微信页面,用position: fixed;定位的input或textarea输入框,在获取输入焦点时,会被弹出的输入法软键盘遮挡,导致用户无法看到输入框,效果如图: 简化测 ...
- 点击底部input输入框,弹出的软键盘挡住input(苹果手机使用第三方输入法 )
测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示: input固定底部设计图.png 点击底部input输入框唤起软 ...
- html限定输入的内容,HTML中限制input 输入框输入内容
限制 input 输入框只能输入纯数字 1.onkeyup = "value=value.replace(/[^\d]/g,'')" 使用 onkeyup 事件,有 bug ,那就 ...
- php清除h5格式,移动端H5页面端怎样除去input输入框的默认样式
这次给大家带来移动端H5页面端怎样除去input输入框的默认样式,移动端H5页面端除去input输入框的默认样式的注意事项有哪些,下面就是实战案例,一起来看一下. 前两天在开发在微信访问的HTML5页 ...
- html5首页图标怎么除掉,移动端H5页面端如何除去input输入框的默认样式
移动端H5页面端如何除去input输入框的默认样式 发布时间:2020-09-29 16:41:58 来源:亿速云 阅读:124 作者:小新 这篇文章主要介绍了移动端H5页面端如何除去input输入框 ...
最新文章
- RMAN 与control文件和spfile文件的备份
- matlab门槛回归,重磅!这可能是最全的门槛回归汇总了
- 《SQL入门经典》学习笔记
- 树莓派php中文乱码,[翻译完成] 树莓派U-Boot
- HashPasswordForStoringInConfigFile 已过时
- OpenWrt常用命令总结
- Hibernate笔记①--myeclipse制动配置hibernate
- 修改Tomcat8 内存
- React学习之进阶WEB组件(二十)
- cdr添加节点快捷键_CDR快捷键大全
- 论文阅读17 | Cross-modality Person re-identification with Shared-Specific Feature Transfer
- 学计算机的制作水印,如何设置属于自己的水印,电脑上制作属于自己的文字水印...
- Spire.pdf Pdf添加图片,无水印
- tp-link tl-wr740n 虚拟服务器,TP-Link TL-WR740N无线wifi无线桥接怎么设置 | tplogin.cn
- 一行代码一道题:求2的幂次方
- DVWA Contradiction #01
- 消费贷款用途证明怎样提供
- QT5+zint库实现条形码条形码(一)
- QVE音乐剪辑器制作手机铃声的方法
- 【Opencv】目标追踪——高斯混合模型分离算法(MOG)
热门文章
- ArcGIS设置默认金字塔弹出框
- Android签名机制学习笔记
- maven配置本地jar包
- 网易:Flink + Iceberg 数据湖探索与实践
- 官宣 | 千呼万唤,Apache Flink 1.11.0 正式发布啦!(内含福利)
- Android自定义View【实战教程】4⃣️----BitmapShader详解及圆形、圆角、多边形实现
- Kotlin实战【三】表示与选择
- updatepanel失效怎么办_[转]jquery与updatepanel二次失效问题解决方案-阿里云开发者社区...
- 哪些场景应用了dsrc通信标准_如何提高量子通信系统的实用性,制约了量子通信系统的应用场景...
- html内容超出不自动滚动,16.css: overflow使用 例: 固定div大小,不让内容超出div