技术库 技术手册 字体库 知识点 词汇表 联系我们
内容搜索   
本站最新推出网站制作字体库。
当前位置:WEB技术知识资源库(www.cn-web.com) .: WEB技术相关 .: XHTML/CSS .: css对网页执行效率的影响和优化

css对网页执行效率的影响和优化


我们现在在规划设计网站,肯定都会用到css来控制整个站点的布局与色调,但是css如果做的好的话可以提高网页的执行效率,给用户带来好的体验:

1.尽量把CSS样式放在页面的上方

  把css放到网页上方,浏览器解析结构的时候,就已经可以对页面进行渲染,显示内容时时就已经直到了效果,如果放到内容的下方时,用户可能会先看到光秃秃的结构,然后内容突然被渲染,给用户的体验效果不太好;

2.将css独立放成一个外部文件

 这是因为外部的引用文件会被浏览器缓存,所以css文件内容较多时即文件 较大时,用户只需要下载一次,以后直接从缓存中读取就可以了,从而极高地提高用户再次访问时的效率;
 
3.避免使用css中的Expressions
CSS Expressions就像其它语言中的if……else……语句。这样在CSS中就可以进行简单的逻辑判断了。举个简单的例子——
<style>
input
{background-color:expression((this.readOnly && this.readOnly==true)?"#0000ff":"#ff0000")}
</style>
<INPUT TYPE="text" NAME="">
<INPUT TYPE="text" NAME="" readonly="true">
这样css就可以根结一些情况分别使用不同的样式了。
但是CSS中Expressions 的代价却是极高的。当你的页面需要根据判断来渲染效果的元素很多的时候,那么你的浏览器将长期处于假死状态,从而给用户带来极差的用户体验。
4.尽量减少压缩css文件的体积
  最终发布版本中把没有必要的空行、空格和注释全部去掉。手工去处理效率太低,这里有一个在线压缩css体积的工具:http://www.cssdrive.com/index.php/main/csscompressor,它提供了多种压缩方式,可以适应多种要求。


对此文章打分评级

用户评论

增加评论
此文章还没有任何评论!
网站地图 - 知识词汇 - 全文检索 - 广告服务 - 帮助中心 - 联系我们
.:www.cn-web.com
网站技术开发联盟之WEB开发技术知识库
联系人:老韩(QQ:5679551)
晋ICP备07003487号