|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
CSS的极大优势表现在简洁的代码,对于一个大型网站来说,可以节省大量带宽,而且众所周知,搜索引擎喜欢清洁的代码。
网页制造poluoluo文章简介:对年夜多半网站而言,优化CSS选择器活得的功能提拔很小,不值得往计算。有些共同Javascript交互的CSS划定规矩会分明的拖慢页面。这是应当存眷的核心。以是我入手下手存眷实际中影响页面功能的CSS款式相干的小成绩。
本文是《EvenFasterWebSites:PerformanceBestPracticesforWebDevelopers(Paperback)》的最初一章。上篇帖子《PerformanceImpactofCSSSelectors》(中文版)最初提出了一段假定:对年夜多半网站而言,优化CSS选择器活得的功能提拔很小,不值得往计算。有些共同Javascript交互的CSS划定规矩会分明的拖慢页面。这是应当存眷的核心。以是我入手下手存眷实际中影响页面功能的CSS款式相干的小成绩。 我收到了良多反应。DavidHyatt的文章《WritingEfficientCSSforuseintheMozillaUI》表露:款式体系衬着一条划定规矩是从最右侧入手下手以后顺次向左挪动。在你的小子树(subtree)延续检测的时分,款式体系将持续向左边挪动直到它不婚配CSS划定规矩或婚配毛病。 由此得出,我们优化事情的重点应当是:婚配大批页面元素的最右边的CSS选择器。我上篇博文测试的CSS选择器看起来很费功能,可是按这条新概念审阅,我们觉察这实在不值得忧虑,好比:这个选择器有5层,看起来很庞大,可是我们来看最右边的选择器A.class0007,我们发明,在全部页面中必要扫瞄器逆向婚配的只要一个元素。
优化CSS选择器的关头点在于最右边的选择器,也叫做keyselector(偶合?)。有一个更高贵的选择器只管这个选择器看起来更复杂,但对扫瞄器婚配而言更高贵。由于扫瞄器要从右至左,入手下手后要反省婚配*的一切元素。这意味着扫瞄器会实验婚配页面中的一切元素。下图为一般选择器与先前的儿女选择器加载工夫的对照:
它明晰的反应出一个婚配良多元素的keyselector会严峻的拖慢页面。其他大概会大批增添扫瞄器事情的keyselector包含:- A.class0007DIV{}#id0007>A{}.class0007[href]{}DIV:first-child{}
复制代码 不是一切的CSS选择器危险功能,只管看起来云云。CSS选择器的关头点在于泛婚配的keyselector。这关于含有大批DOM元素、CSS划定规矩,更高reflow的Web2.0使用加倍主要。
DIV本身就是容器性质的,你不但可以内嵌table还可以内嵌文本和其它的HTML代码CSS是CascadingstyleSheets的简称,中文译作“层叠样式表单”。 |
|