页面重构中的设计模式--学习笔记

页面重构中的模块化核心思想：将HTML和css通过一定的规则进行分类、组合，以达到特定的HTML、css在特定范围内最大程度的复用

页面重构中的模块化

1布局容器：用于页面的布局容器和用于模块化的布局（包括模块容器
2内容模块：

<div class="基类 扩展类 实例类">
   <div>...</div>
</div>

css模块化

借鉴oop的原理 ：
基本原则
1.开闭原则
开：指在基类的基础上，再做扩展
闭：指对指定模块类的修改，在封闭的模块内，不影响木块之外的内容
eg:

.mod-name .class-1{.....}
.mod-name .class-2{.....}

2.替换原则
3.依赖原则

接口：扩展类只负责模块效果的补充；实例类不影响扩展类与基类的依赖关系
结构化设计：高层抽象模块依赖底层抽象模块
4.接口分离原则

继承

扩展类与基类的实现，建立在样式的继承的基础上

面向“效果”的模块化设计