掌握模块化开发的思想是我们进行模块化开发的基础。他有以下几部分组成：

1.css模块化2.html模块化3.js模块化

模块化开发的优势

1.更好的组织和维护代码2.按需加载3.避免命名冲突

css模块化

css模块化编程语言

说到css的编程语言我们就需要了解一下css预处理器，它用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。

css模块化编程语言的的种类

1.sass2.less3.stylus4.Turbine5.Swithch CSS6.CSS Cacheer7.DT CSS……

现阶段流行的编程语言

1.sass(建议使用)    sass的最新版本scss，这个语言有和css相似的结构，直接用*.css文件改文件名为*.scss，就可以进行编译使用2.less

sass编程语言组成

1.变量2.嵌套3.混合4.继承5.函数6.运算7.条件判断与循环8.注释

使用的工具

1.命令行ruby安装使用教程：http://www.imooc.com/code/63892.可视化工具koala下载地址：http://koala-app.com/index-zh.html使方用法：http://www.w3cplus.com/blog/777.html

css开发中的规范（BEM）

1.B（block）:模块化2.E（element）:元素标签3.M（modify）:属性修饰结构：.block{}.block__element{}.block--modifier{}

详细介绍见 参考资料 BEM

参考资料和视频教程

css预处理器相关文档

http://www.w3cplus.com/bookmarks/css-preprocessor.html

sass

http://www.sass-zh.com/docs.html （官方文档跳转）http://www.w3cplus.com/sassguide/syntax.html（文档）http://www.imooc.com/learn/311（视频）http://www.imooc.com/learn/436（视频）http://www.imooc.com/learn/371（视频）

less

http://lesscss.cn/ （官方文档跳转）http://www.imooc.com/learn/61（视频）http://www.imooc.com/learn/102（视频）

BEM

http://www.w3cplus.com/preprocessor/getting-sass-y-with-bem.htmlhttp://www.w3cplus.com/css/battling-bem-extended-edition-common-problems-and-how-to-avoid-them.html