学习总结——css

常见性能优化:

1.CSS Spirite :css精灵,一种网页图片应用处理方式。加速的关键不是降低了重量,而是减少了个数,这样就减少了向服务器请求的次数,从而达到减少请求时间,横向还会减少图       片大小,也能提高性能。

       (允许将一个页面涉及到的所有的图片(尤其是ico多的页面)都包含到一张大图中去,这样页面会一次性显示出该spirite包含的图像。而且对于<200k的图片加载速       度基本没差别。)

       优点:性能提高了,网页设计时只需对一个文件取名,从而提高了网页制作的效率。更改风格方便,只需在这些精灵图片上修改就可以达到改变网页风格的效果。

       缺点:开发繁琐,要用photoshop精确切图。维护时有稍许改变可能会动整张图或者不懂原来的而往图片下加无疑会增加字节还要改css。

2.类似 .test{ background-color:#fff; background-image:url(a.jpg)}写成  .test{ background: #000 url(image.jpg) top left no-repeat;}:缩减字符个数而提高性能。

    常见的有:{font: oblique bold 14px  Arial,’宋体‘;}

         {margin/padding: 5px 10px 20px 15px;}

         {border-width: 2px; border-style: solid; border-color: #000;} -> {border: 2px solid #000;}

         {border-top: 2px; border-right: 5px; border-left: 10px; border-bottom: 3px;} -> {border: 2px 5px 10px 3px;}

学习总结——css,布布扣,bubuko.com

学习总结——css

上一篇:项目实战之中小网站的框架搭建过程


下一篇:eclipse html插件下载和安装