发表于: 2021-03-16 20:11:09
1 1207
今天完成的事情:由于电脑坏了,今天看了css权威指南
明天计划的事情:继续复习将css基础打好
收获:
一、知道了浏览器渲染过程
1、解析HTML,生成DOM树,再解析CSS文件
2、将DOM树和css相结合,生成渲染树(渲染树只包含可见的节点)
3、进行回流
4、进行重绘
5、再展示再页面上
二、了解了什么是回流和重绘
回流:当DOM树中的一部分或者全部因为大小边距等问题发生改变而需要重建的过程
重绘:当元素的一部分属性发生变化,但不会引起布局变化而需要重新渲染的过程
注意:回流一定重绘,但重绘不一定回流
1、添加或删除可见的DOM元素 2、元素的位置变化 3、元素的尺寸变化 4、内容变化 5、浏览器窗口尺寸变化 6、一开始加载页面时
当有这些情况出现时就会进行回流重绘
三、BFC的特性及应用(块格式化上下文):
1、内部box会在垂直方向上,一个一个的放置
2、box垂直方向的距离有margin决定,在一个bfc中,两个相邻的块级盒子垂直外边距时会产生重叠
3、形成bfc的区域不会与float box重叠
4、计算高度时,浮动元素也要参与计算
注意:具有bfc特性的元素可以看作隔离了的独立容器,容器里的元素不会被影响
BFC特性:
1、同一个bfc下边距会发生重叠
2、可以包含浮动元素
3、可以阻止元素被浮动元素覆盖
触发bfc的条件:
1、浮动元素
2、绝对定位元素
3、overfloat除了visible以外的属性
评论