首页 > 其他 > 详细

关于input标签不同type下的盒模型

时间:2019-10-24 23:46:00      阅读:115      评论:0      收藏:0      [点我收藏+]

刚才发现,在Chrome下input标签的不同type类型所取的盒模型是不一样的。浪费了我很多时间去调试,唉。

type="text"时,给它设置宽度width:300px,此时的盒模型是这样的:

技术分享图片

即300px指的是content部分的宽度,不包括padding,border,这是W3C标准下的标准盒模型;

而当type=search,buttom,submit时,width:300px的盒模型是这样的:

技术分享图片

即包括了padding和border部分,这是微软IE浏览器版本678下的IE盒模型。使用时要注意。

关于input标签不同type下的盒模型

原文:https://www.cnblogs.com/wangyi0419/p/11735765.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!