美文网首页
页面重构中的设计模式--学习笔记

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

作者: emma1120 | 来源:发表于2016-10-14 17:17 被阅读41次

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

继承

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

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

相关文章

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

    页面重构中的模块化核心思想:将HTML和css通过一定的规则进行分类、组合,以达到特定的HTML、css在特定范围...

  • 2020-03-23

    美团设计模式在外卖营销业务中的实践-学习笔记(一) 美团设计模式在外卖营销业务中的实践-学习笔记(一)一、设计模式...

  • 模式方法

    从封装变化角度对模式分类 学习设计模式的方法: 重构获得模式Refacting to Patterns:(1)寻找...

  • android提升大法

    1、架构设计 1.1 设计模式 1.2 重构《重构改善既有的代码设计》 1.3 架构模式MVP MVC MVVM ...

  • Android 中的 23 种设计模式

    系列笔记 通过学习 Android 的设计模式而记的笔记。(持续更新中...) 源码地址 Android 单例模式...

  • 简介

    《研磨设计模式》——学习笔记

  • 四巨头23种设计模式的意图

    了解设计模式的意图,是在代码重构中浮现并识别设计模式的关键。本文将四巨头在《设计模式》一书的23种设计模式的意图放...

  • Chan of Responsibility 责任链模式

    设计原则学习笔记 设计模式学习笔记 作用 将请求以其职责拆成,并以链的结构组合,使请求在链中传递并且可以在链中拦...

  • 大话设计模式 读书笔记

    大话设计模式 book: <设计模式> <设计模式解析> <敏捷软件开发:原则, 模式与实践> <重构-改善既有代...

  • 设计模式-工厂模式

    为什么要学习设计模式? 1、写出优雅的代码; 2、更好的重构项目; 3、经典框架都在用设计模式解决问题。 Spri...

网友评论

      本文标题:页面重构中的设计模式--学习笔记

      本文链接:https://www.haomeiwen.com/subject/btxnyttx.html