为了账号安全,请及时绑定邮箱和手机立即绑定

已经清空了各种元素的margin和padding, 为什么此时<body>的高度却是21px呢?

已经清空了各种元素的margin和padding, 为什么此时<body>的高度却是21px呢?

一只名叫tom的猫 2019-03-08 12:23:49
先看代码:<!DOCTYPE html><html><head>   <meta charset="utf-8">   <title>JS Bin</title>   <style type="text/css">       *{          margin:0 ;          padding: 0;       }  </style></head><body>     <img src="" alt=""/></body></html>已经清空了各种元素的margin和padding, 为什么此时<body>的高度却是21px呢?<body>中不是什么都没有吗?
查看完整描述

2 回答

?
qq_花开花谢_0

TA贡献1835条经验 获得超7个赞

在内联盒模型中存在一个名叫“strut”的空白盒,是一个存在于每个“行框盒子”前面,同时具有该元素的字体和行高属性的0宽度的内联盒,此时如果你设置html {font-size: 0} 则body高度就会变为0

查看完整回答
反对 回复 2019-03-08
?
跃然一笑

TA贡献1826条经验 获得超6个赞

因为body标签里有空白字符,浏览器默认字体大小为16px,然后再加上行高(忘记多少了),算起来的话就是21px。不信你把<img>标签替换成 &nbsp;,会是一样的效果。可以尝试将body的font-size设置为0,那此时body的高度就是0了

查看完整回答
反对 回复 2019-03-08
  • 2 回答
  • 0 关注
  • 489 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信