码迷,mamicode.com
首页 > Web开发 > 详细

CSS盒子模型

时间:2017-03-06 14:08:37      阅读:200      评论:0      收藏:0      [点我收藏+]

标签:宽度   pad   bottom   最大值   ott   nbsp   没有   关系   content   

CSS中的盒子模型是由几个属性组成的

content padding border margin

content 指的是盒子内容的 宽度和高度 (height  width)

padding (内边距)指的是内容距离盒子边框  内边缘的距离  它有四个方向

border (边框) 边框包裹着内容和内边距 边框可以有宽度 它有四个方向

margin (外边距) 不同的盒子边框外边缘距离另一个盒子边框外边缘的距离

 

盒子模型的兼容问题:

1、margin值:如果两个盒子上下排布,上面的盒子给值margin-bottom,下面的盒子给值margin-top,那么盒子和盒子之间的距离不是他们两个的和,而是取其中的最大值;

2、margin值:当盒子之间是父子级关系的时候,如果父级盒子没有边框值,没有padding值,那么就会发生子级盒子的margin-top值传递给其父级盒子

解决办法:给父级盒子 overflow:hidden;这个属性(溢出隐藏)

 

CSS盒子模型

标签:宽度   pad   bottom   最大值   ott   nbsp   没有   关系   content   

原文地址:http://www.cnblogs.com/zzzzzzzsy/p/6509402.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!