css如何解决高度不一致问题(2)-木庄网络博客

2022-02-25 07:48:45 PHP中文网 JavaScript 百度已收录

然后说下input高度会比button高两像素的原因

button在高度计算上始终使用了Quirks模式。在Quirks模式下，边框的计算是在元素的宽度内的，而不像标准模式一样计算在外部（button的高度包含边框的高度，而文本框text则不包含边框高度。）

解决办法也很简单，就是给input加上 ↓

1	`box-sizing: border-box;`

或者给button加上 ↓ 就可以了

1	`box-sizing: content-box;`

在这里插入图片描述

希望能给大家解除疑惑=(:з」∠)_

推荐学习：《css视频教程》

相关阅读 >>

更多相关阅读请进入《css》频道 >>

书籍

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者