由于历史的原因，各个浏览器在对页面的渲染上存在差异，甚至同一浏览器在不同版本中，对页面的渲染也不同。在W3C标准出台以前，浏览器在对页面的渲染上没有统一规范，产生了差异(Quirks mode或者称为Compatibility Mode)；由于W3C标准的推出，浏览器渲染页面有了统一的标准(CSSc ...
分类：
Web程序 时间：
2017-08-03 01:00:45
阅读次数：
182
静态文件的设置 静态文件概述： 在网页使用的css文件，js文件和图片叫做静态文件。 设置流程： 动态获取STATIC_URL的方法 在模板文件中加载路径 在图片的地址写入 最终在浏览器渲染成： 总结: /abc/img/mm.jpg 隐藏了服务器端实际保存文件的目录 当STATIC_URL = ' ...
分类：
Web程序 时间：
2017-07-29 18:18:04
阅读次数：
183
浏览器的渲染过程 1，浏览器解析html源码，然后创建一个 DOM树。在DOM树中，每一个HTML标签都有一个对应的节点，并且每一个文本也都会有一个对应的文本节点。DOM树的根节点就是 documentElement，对应的是html标签。2，浏览器解析CSS代码，计算出最终的样式数据。对CSS代码 ...
分类：
其他好文 时间：
2017-07-28 22:16:13
阅读次数：
111
less是一门CSS预处理语言，增加了变量，Mixin，函数等特性，使得CSS更加方便维护，开发； less可以运行在Node或者浏览器，但最终都是将.less文件转换成.css文件，因为浏览器渲染时只能识别.css文件； 1.不同情况下使用less编译器编译less文件 1.1 使用less编译器 ...
分类：
其他好文 时间：
2017-07-22 18:18:01
阅读次数：
266
获取图片高度，jq 用的是height（） 获取 宽度。jq用的是width（）。 只是这个是渲染后的宽高，也就是css设置后的宽高 javascript 是offsetWidth offsetHeight 相同，这个也是浏览器渲染后的大小 那假设我想获取图片原本的大小呢？ 这个时候就须要用到Ima ...
分类：
其他好文 时间：
2017-07-22 12:04:50
阅读次数：
101
染性能 页面不仅要快速加载，而且要顺畅地运行；滚动应与手指的滑动一样快，并且动画和交互应如丝绸般顺滑。 60fps 与设备刷新率 60fps 与设备刷新率 目前大多数设备的屏幕刷新率为 60 次/秒。因此，如果在页面中有一个动画或渐变效果，或者用户正在滚动页面，那么浏览器渲染动画或页面的每一帧的速率 ...
分类：
其他好文 时间：
2017-06-18 19:26:48
阅读次数：
318
浮动定位对文档流元素排版的影响 1.浮动元素会覆盖在文档流元素之上 <div class="A"></div> <div class="B"></div> .A{ width:200px; height:200px; float:left; } .B{ width:200px; height:200 ...
分类：
其他好文 时间：
2017-06-16 16:42:53
阅读次数：
119
块模型（block模型） 1.块模型被浏览器渲染执行的时候会独占一行空间 2.即使块模型的宽度小于页面的宽度，块模型也会独占一行，也就是说块模型独占与它的宽度有关 3.如果要为一个html控件设置高度和宽度，那么这个控件必须是块模型，加display:block变成块模型 如超链接：<a href= ...
分类：
其他好文 时间：
2017-06-16 13:30:10
阅读次数：
209
（摘抄自一篇文章，觉得这里写得非常不错，所以单独放出来，希望能对大家有帮助。）React为啥这么大？因为它实现了一个虚拟DOM（Virtual DOM）。虚拟DOM是干什么的？这就要从浏览器本身讲起如我们所知，在浏览器渲染网页的过程中，加载到HTML文档后，会将文档解析并构建DOM树，然后将其与解析 ...
分类：
其他好文 时间：
2017-06-12 17:08:06
阅读次数：
507
Chrome上各个渲染部分的实际含义： Parse Html: 发送一个http请求，获取请求的内容，然后解析html的过程。 Recalculate Style: 重新计算样式，它计算的是Style，和Layout做的事情完全不同。Layout计算的一个元素绝对的位置和尺寸，或者说是“Comput ...
分类：
Web程序 时间：
2017-06-08 14:01:37
阅读次数：
195
