博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
写页面得来的体会
阅读量:5363 次
发布时间:2019-06-15

本文共 521 字,大约阅读时间需要 1 分钟。

一、说点原则

阐述:浏览器在获得服务器发来的HTML文档的时候,会首先根据文档构建一个DOM树,然后根据DOM元素的样式计算规划DOM树,这期间浏览器会根据 :a.是否绝对定位划分布局空间产生定位层,b.是否浮动产生静态层/浮动层,(定位层凌驾于浮动层和静态层之上,且和二者没有关系)最后才会根据对它进行渲染,做成你看到的页面。用户浏览页面的时候,一些操作会调用JavaScript更改DOM样式,如果仅仅是外观的改变,会触发浏览器的repaint(重绘)事件,如果更改了DOM元素的布局,那么会触发reflow(回流)事件,回流需要重新计算规划DOM树,比重绘要复杂。所以我们可以总结以下一些原则:

1.能不用绝对定位就不用绝对定位。

2.能不让DOM元素浮动就不让DOM元素浮动。

3.如果绝对定位能解决问题,那么不要浮动。虽然二者都触发了回流事件,但是绝对定位带来的布局空间的堆叠产生定位层和其他层面无太多关系,仍可以被浏览器精确的计算并重新渲染。而浮动元素涉及到静态层和浮动层元素间的布局定位关系,是浏览器渲染引擎更难计算。

(未完待续) 

转载于:https://www.cnblogs.com/JhoneLee/p/CSS.html

你可能感兴趣的文章
C++学习之:括号匹配与栈的使用
查看>>
IOS 获取wifi的SSID
查看>>
让用户输入一个宠物名字,然后检查该名字是否在宠物列表中
查看>>
chrom调试
查看>>
成员函数对象类的const和非const成员函数的重载
查看>>
机器学习实战-----八大分类器识别树叶带源码
查看>>
eclipse git 新的文件没有add index选项
查看>>
java 泛型
查看>>
VC NetShareAdd的用法
查看>>
java web项目中后台控制层对参数进行自定义验证 类 Pattern
查看>>
C#学习教程
查看>>
Linq to sql 的语法
查看>>
soapUI问题解决
查看>>
Tomcat学习笔记(十一)
查看>>
Spring Data JPA 定义超类
查看>>
Codeforces 10C
查看>>
黑暗之光 Day1
查看>>
static 的使用
查看>>
SQL語句性能比較
查看>>
Ubuntu 16 编译装python2.7
查看>>