大家好，欢迎大家收听收看本期的咨道一课。今天这个课件里爆老师给大家讲一个如何清理css无用代码的实例。尽可能的将样式文件变的更小，更简洁，从而让蜘蛛抓取和用户打开速度更快。
首先我们用这个小网站作为例子，如果你有chrome浏览器的话，你可以在页面上右键鼠标按审查元素。在这个功能里有一个审计功能，帮助查看一些问题。随后点击audit按钮，并且打上select all，再按一下run。
随后你能看到谷歌浏览器给到你一些建议，比如minimize cookie size就是让你降低cookie所需的容量；再看下面的web page performance一项中我们可以看到一个叫做“remove unused CSS rules”，这个就是我们今天讲到的无用css代码的审查功能。它会分析这个页面所需css文档，是不是里面code都需要，有多少比例的code是不需要的。比如这个页面对于这个site_global.css文档有73%的code是不用的。既然不用，为什么还要把这些样式代码写在里面呢？所以我就需要去修改样式代码，删掉闲置的部分，缩小加载容量。
怎么去做呢？这个软件只是告诉我们问题在哪里，并不能直接帮我们去做修改。我们也不可能根据这里的提示，一条条去修改样式代码吧，所以我这里介绍一个软件可以有效帮我们做修改的。好，让爆老师切换到这个页面。
这个软件是支持firebox的插件的，在add-on里面有一个叫做dust-me selectors，你去安装这个小插件后，重启浏览器。你再点击鼠标右键就会有一个spider this page的按钮，你把这个小扫帚图标点一下。你要做的事情就是让这个小插件去抓一下这个网页，按一下start。
跳出来了一个窗口，这个窗口里面会显示这个页面下所需css的结果表。它会把这个site_global.css哪些不需要的code给抓出来，并且告诉你是在第几行的。那你现在要做的就是用的它的CLEAN功能，只要一点后你就看到一个内嵌的html editor的窗口，这个里面你可以很容易看到哪些闲置代码，它们是在哪里并且用颜色飙了出来。绿色是有用代码，加块的是无用的。
随后你需要在下面选择“commented-out”或是“removed”，前者是帮你注释掉，后者是帮你删掉。我们选择removed的，随后按save按钮，取名叫做site_global-cleaned.css,保存到目录下面。
在打开目录比较下，这个是没有修改的过的，一个是修改过的。之前是6k，修改后是4k，那就节省了2k。你的css文件内容越多越大，那就释放空间越多。随后我们打开这两个文件，这个是没改过的有好多的code。改过之后的只有247条，没改过的364条，将近100条。
随后你save后，把它上传到FTP上覆盖掉之前的老css文件。你再回到之前页面上刷新一下。run一下这个软件，你就不会再看到unused selectors，说明优化成功，而且页面显示不会出任何问题。所以这个软件是很方便的，有助于我们代码的优化，提升我们的工作效率。
这就是爆老师今天和大家分享的内容，希望大家喜欢。也可以留言哦，我们下次再见！
