首页 > 其他 > 详细

关于盒模型的外边距padding和内边距margin

时间:2020-02-13 22:02:43      阅读:53      评论:0      收藏:0      [点我收藏+]

 

边框border属性值  solid实线   dashed虚线   dotted点线   double双实线

/* 内边距 */
padding:20px 30px 30px 30px;若有四个值代表  上/右/下/左 
padding: 10px 20px 30ox;三个值代表 上、左右、下 
padding: 10px 20px;两个值代表  上下/左右 
padding: 10px;一个值代表四个方向一致 

/* 外边距 */

margin:20px 30px 30px 30px;若有四个值代表  上/右/下/左 
margin: 10px 20px 30ox;三个值代表 上、左右、下 
margin: 10px 20px;两个值代表  上下/左右 
margin: 10px;一个值代表四个方向一致 

此外,外边距(margin)垂直方向会叠加

叠加的规则:
1、同为正数,取最大
2、同为负数,取绝对值最大
3、一正一负 取和 

盒子模型的宽度:width+padding+border
盒模型的组成:width+padding+border+height
盒模型的高度:height+padding+border 

技术分享图片

 

关于盒模型的外边距padding和内边距margin

原文:https://www.cnblogs.com/maleijiejie/p/12305012.html

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