首先,每个页面都会加载以下两个 css,data/cache/style_1_common.css 和 data/cache/style_1_forum_index.css 。

先讲讲这两个文件名的命名规则:

第一个是整站通用的 css,所以命名为 common.css,然后前面的代号是你使用了哪套风格,所以 style_1_common.css 表示是第一套风格的共用的 css;

第二个是表示 forum 的 index 页面风格,也就是论坛的首页风格。

下面讲一下那两个 css 是如何生成的。
首先,那两个 css 是程序生成的 css 缓存,所以你要改 css 的话,不能直接改那两个文件,否则一更新缓存,之前的改动就无效了。大家可以看到 template 对应的每套模板中,就拿自带的 default 模板举例吧,default 模板中,带有一个 common 的文件夹,里面有 css 文件,common.css 对应的就是生成缓存的 style_1_common.css 文件,style_1_forum_index.css 对应的是 module.css 。

common.css 没有什么特别之处,里面也有 css 的说明,跟普通的 css 差不多。
大家打开 module.css,可以看到有这样的说明,

  1. /** group::index **/
  2. /* 群组 index 模块使用的 CSS */
  3. /** end **/

/** group::index **/开始到/** end **/结束,说明是 group 频道的 index 模块使用的 CSS,也就是群组频道对应的首页模板将使用的 CSS 。

再举个例子,/** misc::invite,group,forum::viewthread **/开始到/** end **/结束,说明是 misc 频道的 invite 模块、 group 频道的全部模块和 forum 频道的 viewthread 模块使用的 CSS 。

ok,下面的大家可以参照这个学习一下,包括你想扩展他,都可以直接在里面直接添加就可以。

下面讲讲缓存 css 是如何生成的,common.css 比较简单,就是直接读取,然后生成到 data/cache 目录下。

每个频道模块独立的 css,会先将 module.css 在 data/cache 下生成一个对应的风格 id 下的缓存的 css,然后当你访问某个频道时,会生成对应频道下的 css,此时,刚才介绍的那些标识就起作用了。程序会根据/** group::index **/和/** end **/这种标识,拆分出哪些频道、哪些模块该需要哪些 css 。

程序部分就不介绍了,程序的代码主要在 source/class/class_template.php 文件处理,有兴趣的同学可以深入研究一下。