css js 优化工具
我知道国内很多网页制作人员都还在制作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 优化工具的更多相关文章
- HTML,CSS,JS优化
HTML部分 语义化HTML:好处在于可以使代码简洁清晰,支持不同设备,利于搜索引擎,便于团队开发: 减少DOM节点:加速页面渲染: 给图片加上正确的宽高值:这可以减少页面重绘,同时防止图片缩放: 防 ...
- 前端开发必备 40款优秀CSS代码编写工具推荐
摘要:CSS工具可以简化工作流,可以提高CSS编写速度,是开发者和设计者所不可缺少的.本文列举了40种CSS工具,功能涉及CSS菜单.动画.3D图形.响应式页面.图层.按钮等界面元素的设计与制作,你定 ...
- css,js工具篇
4. web前端开发分享-css,js工具篇 web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emm ...
- 关于js优化和css优化
css优化: 1.css代码的压缩. 2.css文件的合并. 3.不滥用float,因为float在渲染时计算量比较大,所以尽量减少使用float. 4.避免在html标签中写style属性. js优 ...
- 前端小白页面开发注意事项及小工具(html\css\js)
技术一直在向前发展.但是有一些是相通的,要找准重点,将80%的时间放在提升基础问题上,余下的20%再去学习框架,库和工具. HTML 1. HTML 属性应当按照以下给出的顺序依次排列,确保代码的易读 ...
- 【工具相关】web-HTML/CSS/JS Prettify的使用
一,打开Sublime Text,代码如下面所示. 二,鼠标右键--->HTML/CSS/JS Prettify--->Prettify Code.代码如图所示,明显的代码变得整齐了.
- 纯JS文本比较工具
前段时间由于工作需要写了一个纯JS文本比较工具 在这里与大家分享下 算法有待优化,还希望大家多多指教 先上效果图: 奉上源码(把源码保存为html格式的文件就可以直接运行了): <!doctyp ...
- Gulp:静态资源(css,js)版本控制
为了防止客户端的静态资源缓存,我们需要每次更新css或js的时候,通过md5或时间戳等方式重新命名静态资源: 然后涉及到的html模板里的src也要做相应的修改,静态资源需要优化(压缩合并) 文件目录 ...
- HTML/CSS/JS编码规范
最近整理了一份HTML/CSS/JS编码规范,供大家参考.目录:一.HTML编码规范二.CSS编码规范三.JS编码规范 一.HTML编码规范 1. img标签要写alt属性 根据W3C标准,img标签 ...
随机推荐
- 设置VIM的配色方案
[转]Ubuntu的VIM的默认颜色难看死了,蓝色的注释基本上看不到. 查看有多少配色方案: $ ls /usr/share/vim/vim72/colors 发现有以下文件 blue.vim ...
- UVa 10330 Power Transmission / 最大流
最大流 这题有很多起点和终点 在取2个点(0和n+1) 作为唯一的起点和终点 此外每个点也有容量限制 建图时每条边上的容量为这条边和2个端的容量的最小值 然后EK就行 #include <cst ...
- 几种能在O(n*log(n))时间排序
线性时间排序 各种排序算法总结已经介绍了几种能在O(n*log(n))时间内培训n个数的算法.归并排序和堆排序达到了最坏情况下的上界:快速排序在平均情况下达到该上界.这些算法都有一个有趣的性质:在 ...
- 仿OpenStack开发云计算管理软件
仿OpenStack开发云计算管理软件 使用Python语言开发一套类似OpenStack的云计算管理平台LouCloud,具备基本的用户,服务器,镜像与 虚拟机管理功能,学习IaaS,虚拟化,Lib ...
- 道可叨 | Python 标准库 urllib2 的使用细节
道可叨 | Python 标准库 urllib2 的使用细节 request = urllib2.Request(uri) request.add_header('User-Agent', 'fake ...
- linux下执行sh文件报错:oswatcher_restart.sh: line 13: ./startOSW.sh: Permission denied
1 查看执行sh文件的内容 [root@xxxdb0402 dbscripts]# more oswatcher_restart.sh #!/usr/bin/ksh #export oswdir=` ...
- Java基础03 构造器与方法重载
作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 在方法与数据成员中,我们提到,Java中的对象在创建的时候会初始化(initial ...
- France '98
http://acm.hust.edu.cn/vjudge/contest/view.action?cid=30506#problem/H #include<map> #include&l ...
- perl malformed JSON string, neither tag, array, object, number, string or atom, at character offset
[root@wx03 ~]# cat a17.pl use JSON qw/encode_json decode_json/ ; use Encode; my $data = [ { 'name' = ...
- 基于visual Studio2013解决面试题之0909移动星号
题目