css 盒模型遇到的坑

时间:2021-03-17 14:55:34   收藏:0   阅读:0

我们都知道标准盒模型和怪异盒模型是有不同的

  技术图片

 

 但是知道遇到一个面试题,还是感觉自己理解的不够深刻

  面试题:

    一个div宽200高100,padding-top为50%,问实际高度为多少?

 

  一道题很多坑:

    坑一:不要想当然的是一个盒模型,两个都要答!

    坑二:只有50%,没有给父元素高度!

    坑三:注意注意?? :当padding,或者margin为百分比的时候,它们的参考对象实际是父元素的宽度,不是高度

    

  所以我认为的答案为:

     ie盒模型的实际高度为:设置的高度:100

     标准盒模型的高度为:100 + 父元素宽度的50%

  由于电脑没有下在ie浏览器,无法测试,有不同意见的欢迎讨论

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!