css文档流操作
css盒模型

盒子宽度 = width + padding左右 + border左右
盒子高度 = height + padding上下 + border上下
margin相关技巧
1、设置元素水平居中: margin:x auto;
2、margin负值让元素位移及边框合并
外边距合并
外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。解决方法如下:
1、使用这种特性
2、设置一边的外边距,一般设置margin-top
3、将元素浮动或者定位
margin-top 塌陷
在两个盒子嵌套时候,内部的盒子设置的margin-top会加到外边的盒子上,导致内部的盒子margin-top设置失败,解决方法如下:
1、外部盒子设置一个边框
2、外部盒子设置 overflow:hidden
3、使用伪元素类:
.clearfix:before

本文详细介绍了CSS中的文档流概念,包括盒模型、margin的使用技巧,如外边距合并与margin-top塌陷的解决方案。同时,文章讨论了块元素、内联元素和内联块元素,以及浮动特性和清除浮动的方法。此外,还深入探讨了定位技术,如position的absolute、relative、fixed等,以及定位元素的特性。
最低0.47元/天 解锁文章
104

被折叠的 条评论
为什么被折叠?



