盒子模型
Posted dumenglong
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了盒子模型相关的知识，希望对你有一定的参考价值。
理解：所有的元素都可以看作是盒子，包括内容、内边距、边框、外边距组成
margin:外边框，在最外侧，有上下左右四个方向
margin-top 用来设置盒子上部的外边距
margin-bottom 用来设置盒子下部的外边距
margin-left 用来设置盒子左侧的外边距
margin-right 用来设置盒子右侧的外边距
border 边框宽度 通常用px规定宽度
padding 内边距 同样也是上下左右四个方位
通常盒子可以分为两种类型
标准盒子和怪异盒子
标准盒子：简单理解，假如设置宽度为30px，高度为20px的盒子，
并且边框为1px，外边距为5px，内边距为2px，则我们可以计算一下，整个盒子的宽度就为
30px+1px*2+2px*2+5px*2=46px
同理高度为 20px+1px*2+2px*2+5px*2=36px
这个是标准盒子的计算
怪异盒子：假如设置宽度为30px，高度为20px的盒子，则最终的宽度和高度不会变，还是宽30px，高20px，
以上是关于盒子模型的主要内容，如果未能解决你的问题，请参考以下文章