css 站内优化小技巧

大家不要小瞧css的站内优化,一旦优化好了,确实能提升网站打开速度,代码加载的效率。那么如何将css代码进行优化呢？下面先让我们来看一下css选择器的执行和浏览器的渲染过程。

正常浏览器是从右至左来处理选择器的，这里是渲染的过程，得到数据之后，浏览器要先绘制一个DOM树，然后再有一个 “reflow” 的过程，这个过程就是在CSS 文件下载之后，确定要渲染的元素在DOM中的位置，而CSS 样式中，很多很多在应用的时候都要有一个“reflow” 的过程，所以，避免这个过程，后者减少这个过程，都会相当大的提升浏览器的效率。还有一个就是 CSS 选择器的优先问题了，这个这里不多说了。我们通常的选择器会这么写：

.main .pright div a{color:red;}

浏览器的工作过程是绘制好DOM 树之后，就会查找页面中所有a 元素了。查找到所有的 a 元素之后，又开始查找出于 .main类下面的.pright类再找div，最后找到a标签，如果这个div里面有好多好多a元素就会是一个非常耗费资源的事情。那么如果这里有更多 个.XXX 呢?所以我们可以这么写，在div里的所有a元素都加上class=“XXX”，选择器就会这样写了：

.main .pright div a .XXX{color:red;}

css 站内优化小技巧还有很多,这只是其中的一点，优秀的css代码确实能让你的网站速度变快,运行效率的提升。