我知道国内很多网页制作人员都还在制作table式网页,这样的网页打开速度很慢。如果要想网站打开速度快,就要学会使用DIV+CSS,将图片写进CSS,这样如果网站内容很多的时候,也不会影响网页的浏览。它会先显示文字,在你一边浏览的时候,它就一边加载网页的图片。但是很多初学者写的CSS就是代码不够简洁,很多地方重复多余。

现在,我就教大家如何优化CSS,压缩CSS的大小,使网页加载速度更快。

要优化你网站的CSS,首先第一步就是要将你的多个CSS文件合并,这样减少一个CSS文件你的网页速度就会快上一点。CSS文件越少越好,最好只有1个。这样少一个CSS,就直接减少一个http请求。

其次,我给大家推荐一个叫Clean CSS的网站,网址是http://www.cleancss.com/,将你的CSS代码或者CSS文件的URL路径放在输入框中,然后选择你的压缩级别,最后点击“Procsss CSS”。你就可以看到,CSS代码现在简洁多了,注释语句没有了,还有一些代码也合并了,颜色代码简写了。前后比较一下你的CSS文件,你就会发现,文件变小了很多。

最后,你还是不满意的你CSS文件大小的话,我们还可以进一步压缩,但是这样以来就会影响到以后的阅读了。我还是将这个压缩工具也一起告诉大家,它就是Online YUI Compressor,地址是http://www.refresh-sf.com/yui/。注意这个不但可以压缩CSS,还可以压缩JS,但是压缩后的文件都会变成一行,它把所有换行的空白都去掉了,这样文件更加小了。如果你以后不再修改CSS了,那么可以使用一下。文件真的会变小很多哦。

css js 优化工具的更多相关文章

  1. HTML,CSS,JS优化

    HTML部分 语义化HTML:好处在于可以使代码简洁清晰,支持不同设备,利于搜索引擎,便于团队开发: 减少DOM节点:加速页面渲染: 给图片加上正确的宽高值:这可以减少页面重绘,同时防止图片缩放: 防 ...

  2. 前端开发必备 40款优秀CSS代码编写工具推荐

    摘要:CSS工具可以简化工作流,可以提高CSS编写速度,是开发者和设计者所不可缺少的.本文列举了40种CSS工具,功能涉及CSS菜单.动画.3D图形.响应式页面.图层.按钮等界面元素的设计与制作,你定 ...

  3. css,js工具篇

    4. web前端开发分享-css,js工具篇   web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emm ...

  4. 关于js优化和css优化

    css优化: 1.css代码的压缩. 2.css文件的合并. 3.不滥用float,因为float在渲染时计算量比较大,所以尽量减少使用float. 4.避免在html标签中写style属性. js优 ...

  5. 前端小白页面开发注意事项及小工具(html\css\js)

    技术一直在向前发展.但是有一些是相通的,要找准重点,将80%的时间放在提升基础问题上,余下的20%再去学习框架,库和工具. HTML 1. HTML 属性应当按照以下给出的顺序依次排列,确保代码的易读 ...

  6. 【工具相关】web-HTML/CSS/JS Prettify的使用

    一,打开Sublime Text,代码如下面所示. 二,鼠标右键--->HTML/CSS/JS Prettify--->Prettify Code.代码如图所示,明显的代码变得整齐了.

  7. 纯JS文本比较工具

    前段时间由于工作需要写了一个纯JS文本比较工具 在这里与大家分享下 算法有待优化,还希望大家多多指教 先上效果图: 奉上源码(把源码保存为html格式的文件就可以直接运行了): <!doctyp ...

  8. Gulp:静态资源(css,js)版本控制

    为了防止客户端的静态资源缓存,我们需要每次更新css或js的时候,通过md5或时间戳等方式重新命名静态资源: 然后涉及到的html模板里的src也要做相应的修改,静态资源需要优化(压缩合并) 文件目录 ...

  9. HTML/CSS/JS编码规范

    最近整理了一份HTML/CSS/JS编码规范,供大家参考.目录:一.HTML编码规范二.CSS编码规范三.JS编码规范 一.HTML编码规范 1. img标签要写alt属性 根据W3C标准,img标签 ...

随机推荐

  1. c# 课堂总结7--函数

    函数:数据类型-变量类型-运算符号表达式-语句(顺序,分支,循环)-数字 程序里的函数:能完成一个相对独立功能的代码块.数学里的函数:高度抽象.函数四要素:函数名,输入(参数),输出(返回值类型),加 ...

  2. BZOJ 2795: [Poi2012]A Horrible Poem( hash )

    ...字符串hash. 假如长度x是一个循环节, 那么对于任意n(x | n)也是一个循环节. 设当前询问区间[l, r]长度为len = ∏piai, 最终答案ans = ∏piai' ,我们只需枚 ...

  3. LoadRunner脚本增强

    1.检查点 web_find() 和web_reg_find() 2.Block技术 如果对不同的事物进行不同次数的循环该怎么处理?默认情况下LoadRunner对所有的事物都是统一执行的,即虽然有多 ...

  4. Ibatis2.3.4的一个bug

    java.lang.ClassCastException: com.chat.upgrade.domain.ClientFile cannot be cast to java.lang.String ...

  5. Unity 3D 建立开发环境

    之后的基本方向 ios游戏开发,基础教程http://www.devdiv.com/unity_d_-thread-128068-1-1.html,学习Unity 3D游戏开发. 应该昨天表示,读了一 ...

  6. (1)ActivityThread分析

    1. 入口. 曾经一直都说Activity的人口是onCreate方法.事实上android上一个应用的入口,应该是ActivityThread.和普通的java类一样,入口是一个main方法. pu ...

  7. 创建服务类PO

    转载:https://blogs.sap.com/2014/03/04/creating-a-simple-service-po-using-bapipocreate1bapipochange/ Cr ...

  8. linux环境设置:使ftp不输密码

    # cd ~; # vi .netrc; Add beloew words, 可以追加多个账户: machine yourservername login yourname password your ...

  9. springMVC 使用jstl

    jsp页面获取数据,感觉最方便的就是使用jstl+EL了,各种封装好的函数非常简单易用,接下来写如何使用jstl: 1.下载jstl-1.2_1.jar 2.由于项目是: xmlns="ht ...

  10. URAL 1180. Stone Game (博弈 + 规律)

    1180. Stone Game Time limit: 1.0 second Memory limit: 64 MB Two Nikifors play a funny game. There is ...