css模块化(三)

第二节讲了模块化的一个实例,给出了常见的三种设计方式。而推荐的也就后面两种。

这次,我们讲讲第四种设计方式。

 

这是从鬼哥的css森林中此文章:http://www.cssforest.org/blog/index.php?id=167中扒出的图。

此设计模式是把复杂版作为基类,简化版就只是覆盖某些属性而已。这样,复杂版的html中就只有一个类,而简化版有两个类。

相对之前说的提取一个基类作为两种设计的共有类,然后彼此再设计扩展类,复杂版就少了一个class。

事实上,我对此示例有疑问的。因为示例给出的可以看做是同一个东西。就好像复杂版的模块html中少了图像和回复而已。简单版的扩展类只是覆盖复杂版中的某些样式属性服务的。

但是,也是一种模块化的设计方式。

原文地址:https://www.cnblogs.com/my_front_research/p/2866237.html