前端学习笔记十一

1,外边距

margin也是复合属性也分上右下左

块级元素将左右属性都设置为auto可使块级元素水平居中

使用margin定义块元素的垂直外边距时可能会出现外边距的合并

行内元素不要给上下的margin和padding(上下的margin和padding会被忽略,左右magin和padding会起作用)

2,盒子的宽和高

2.1宽度属性width和高度属性height仅适用于块级元素,对行内元素无效(img和input除外).

2.2计算盒子模型的总高度时还应考虑上下两个盒子垂直外边距合并的情况

当上下相邻的两个块级元素相遇时,如果上面的元素右下边距margin-bottom,下面的元素有margin-top,则他们之间的垂直距离不是margin-bottom加margin-top,而是两者中的较大者。这种现象被称为相邻块元素垂直外边距的合并也叫外边距塌陷。

2.3对于嵌套关系的块级元素,如果父级元素没有上内边距和边框,则父元素的上外边距会和子元素的上外边距合并。合并后外边距为两者中的较大者。

解决方法是:为父元素增加上边框或上内边距

你可能感兴趣的:(前端学习笔记十一)