摘要:
从上面这个图中,我们可以看到那么几个事:1)浏览器会解析三个东西:一个是HTML/SVG/XHTML,事实上,Webkit有三个C++的类对应这三类文档。解析这三种文件会产生一个DOM Tree。CSS,解析CSS会产生CSS规则树。Javascript,脚本,主要是通过DOM API和CSSOM 阅读全文
摘要:
缓存DOM对象 JavaScript的DOM操作可以说是JavaScript最重要的功能,我们经常要根据用户的操作来动态的增加和删除元素,或是通过AJAX返回的数据动态生成元素。比如我们获得了一个很多元素的数组data[],需要将其每个值生成一个li元素插入到一个id为container的ul元素中 阅读全文
摘要:
浏览器在构造DOM树的同时也在构造着另一棵树-Render Tree,与DOM树相对应暂且叫它Render树吧,我们知道DOM树为javascript提供了一些列的访问接口(DOM API),但这棵树是不对外的。它的主要作用就是把HTML按照一定的布局与样式显示出来,用到了CSS的相关知识。从MVC 阅读全文
摘要:
【第311期】网站的灵魂——性能 2015-08-04 飘扬的红领巾 前端早读课 来自早读君: 以前分享性能,更多的会分享在前端部分,这么多年过去了,性能优化还是那些,今天来看看整体的是什么样的?这次分享分享会涉及到服务端,有兴趣的可以多了解下。 正文从这开始~ 什么是性能 有人说性能就是访问速度快 阅读全文
摘要:
标准参考 根据 W3C CSS2.1 规范中的描述,对于非替换的浮动元素,若 'margin-left' 或 'margin-right' 特性的计算值为 'auto',则它们的实际使用值为 '0'。 除此之外,'margin-left' 与 'margin-right' 特性的计算则采用其自身定义 阅读全文
摘要:
由于浏览器版本的不同,对CSS里某些元素的解释也不一样,针对浏览器版本不同而选择不同CSS的代码,其实我们还可以利用条件注释的方法来达到类似的目的,什么是条件注释,在此简单介绍一下,无非就是一些if判断啦,呵呵,但这些判断不是在脚本里执行的,而是直接在html代码里执行的,下面来介绍一下使用方法吧。 阅读全文
摘要:
绝对定位元素的“有定位属性(relative或absolute)的父元素”在渲染层次时起到了主要作用,前面的被后面的覆盖了。解决办法就是给有定位属性的父元素设置z-index 解决办法: 父级元素加上position:relative;并设置z-index. 父级元素的z-index优先,其中包含的 阅读全文
摘要:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.or 阅读全文
摘要:
在CSS布局中float属性经常会被用到,但使用float属性后会使其在普通流中脱离父容器,让人很苦恼 1 浮动带来布局的便利,却也带来了新问题 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <tit 阅读全文
摘要:
haslayout 是Windows Internet Explorer渲染引擎的一个内部组成部分。在InternetExplorer中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元 素来计算尺寸和组织内容。为了调节这两个不同的概念,渲染引擎采用了 hasLayout 的属性,属性 阅读全文