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

页面重构中的模块化核心思想:将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.接口分离原则

继承

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

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,932评论 25 709
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,841评论 1 92
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,087评论 19 139
  • 最近一个人回宿舍,路上虽有路灯,但是还是很安静。而且没有人! 我是不太怕黑的,但是在先生面前总是很胆小的样子,这点...
    一颗有趣的豆阅读 145评论 0 0
  • PART 1 Summary Chapter 10 A Young Man's Long, Awkward, Oc...
    ZHAODAIWEI阅读 1,513评论 0 0