本文主要是介绍盒子内外边距和边框宽度的四个参数值，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
无论W3C标准盒子模型，还是IE盒子模型，都具有margin（外边距）、border（边框）、padding（内边距）、content四个属性。
其中margin、padding最多支持4个值的设置，分别是x-top、x-right、x-bottom、x-left。
他们分别设置为一个、两个、三个、四个时，对应的布局不同。
margin
margin: 20px;（外边距 上、下、左、右各20px。）
margin: 20px 40px;（外边距 上、下20px；左、右40px。）
margin: 20px 40px 60px;（外边距 上20px；左、右40px；下60px。）
margin: 20px 40px 60px 80px;（外边距 上20px；右40px；下60px；左80px。）
padding
padding: 20px;（内边距 上、下、左、右各20px。）
padding: 20px 40px;（内边距 上、下20px；左、右40px。）
padding: 20px 40px 60px;（内边距 上20px；左、右40px；下60px。）
padding: 20px 40px 60px 80px;（内边距 上20px；右40px；下60px；左80px。）
border
border有些许不一样，因为他本身是按照border:border-width（宽度） border-style（样式） border-color（颜色）的顺序书写的，但是他的border-width属性可以上面同样的方式进行布局，不过有点小差别，分别是border-top-width、border-right-width、border-bottom-width、border-left-width，即：
border-width: 20px;（边框 上、下、左、右各20px。）
border-width: 20px 40px;（边框 上、下20px；左、右40px。）
border-width: 20px 40px 60px;（边框 上20px；左、右40px；下60px。）
border-width: 20px 40px 60px 80px;（边框 上20px；右40px；下60px；左80px。）
如有纰漏，还望指正。
这篇关于盒子内外边距和边框宽度的四个参数值的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
