兔源码网 - 专注DZ模版分享、DZ插件分享!

 找回密码
 立即注册

QQ登录

只需一步,快速开始

广告
温馨提示:本站所有DZ相关模板、插件、教程(包括DZ应用中心已下架插件、模板)所有用户可全部免费下载,无任何收费模式(不包括VIP版块非DZ资源,VIP版块需购买会员组方可下载),如本站没有您需要的插件或模板,请自行前往淘宝互站网送吗网等第三方站点搜索相关插件或模板进行低价格购买下载本站非常不建议用户浪费金钱前往DZ应用中心购买。

Discuz-x系列教程 DX的css命名规则、缓存、加载机制

[复制链接]
tuyuanma 发表于 2017-3-11 20:20:47 | 显示全部楼层 |阅读模式
温馨提醒:禁止内容附带广告图片、二维码图片,否则将在不通知情况下永久禁言账号!
欢迎加入兔源码站长交流群,您的加入是我们前行的动力!

DZ站长建站交流群:493651246

[ 温馨提示:点击上方群文字,可快速加入QQ群 ]


首先,每个页面都会加载以下两个类似的css:
- J& n  @  ~2 M0 u: ]* i% edata/cache/style_1_common.css
* A1 j, w& T$ Q9 ?- a5 ?5 ?; ]% [data/cache/style_1_forum_index.css # @, B) H) F' t$ p
/ L7 ~! |1 s4 g- t% \
一、两个文件名的命名规则
3 y7 Y& p5 b1 w( p" d
# o3 k4 v5 s0 h! M
style_1_common.css
1 K/ z2 g8 @* t1 p9 Q|--是整站通用的全局css,所以命名为【style_1_common.css】
6 o2 O% \3 \# u1 H. x) M- d|--前面的代号是当前使用这套风格的ID,所以style_1_common.css也就是第一套风格的共用的css
  H- T! W' S3 q0 V* B8 G5 a( B$ t! G9 o/ x! ^3 q! z& F8 n% Q
style_1_forum_index.css + l; I9 I* i# |. @/ v. D( m5 y9 p7 |
|--是【forum】广场BBS频道首页的css样式,那么forum和index分别对应这CURSCRIPT和CURMODULE的常量值,这个在每个频|--道的入口脚本里都有定义,比如forum频道页面对应的是forum.php。
) F3 H% _6 P) p+ w( b5 ~, o) t* j* U  q4 Q+ b$ l, q
以上介绍的是css的缓存加载文件,当然,还有一些在特殊页面的css,这里就不详细描述了。
! A! Y+ G! M9 r5 W; J% u9 D) \" M. O, {# c3 ?
这两个css文件的生成
# U7 [3 O" c8 h8 a2 }% F+ y4 c4 A8 ?$ L7 H0 ]/ t
首先,那两个css是程序生成的css缓存文件,所以如果要改css的话,不能直接改那两个文件,否则一更新缓存,之前的改动就无效了。
; E; ]; p6 N. Y9 F: |+ l2 T; }拿自带的default模板举例吧,default模板中,带有一个common的文件夹,这个文件夹存放的是全局模板文件,
) @  D$ _1 c2 B里面有css文件: 9 d+ Z0 i$ d# T
style_1_common.css 是【common.css】生成的缓存 9 v7 Z+ v! E9 l& V# s% {( z: T* M
style_1_forum_index.css 是【module.css】生成的缓存 # ^; m$ E0 z1 [' X  l  p, `

. \  M9 [: A2 u( L7 _  G二、module.css的缓存和加载机制 ) C+ ^9 y9 @+ h& U' @
7 k: F- _) A, ?: }* U
打开module.css,可以看到有这样的说明
  1. /** forum::index **/ 广场频道:首页 css代码开始
    , \4 g7 A3 m. k, l# u  P
  2. 这里是css代码 $ g0 ^# L0 i5 r; `; q
  3. /** end **/ 广场首页css代码结束
复制代码
这就是经常在模板中用到的判断,程序读取这个css文件的内容,通过标识进行判断,最后把符合条件内的所有css生成在一个对应的缓存文件中。 ! k& V: h" ^7 n
8 _9 o! M6 {: U$ k
再举个例子: 2 g3 Z/ T- A  [
/** forum::index,forum::viewthread **/ 广场频道:首页模块和帖子阅读页CSS代码开始 : _+ I# D# D1 l, s3 s* D
这里是css代码
8 ~, F3 \  z- ?. |) N9 ~* d+ R* e/** end **/ 结束
* D( ?  u; A5 @8 h- u) `( t第二个例子大家应该知道了,就是再增加一个条件,这里可以不止两个:
9 `- m% J9 H4 R7 h! J' F, R/** forum::index,forum::viewthread,forum::forumdisplay,XXXX **/
5 w( l' C2 K3 I8 G- ^/ w, U+ m! X' D# b, G5 J8 s5 `% M
ok,根据自己的需要来加就行了,记得符号【,】
, M9 z) K9 e4 F5 y9 N0 M8 k大家可以参照这个学习一下,包括你想扩展他,都可以直接在里面直接添加就可以。
" H6 e" Y, V( X+ i2 F% U0 k* F, x( I. d& O+ R0 t  C
下面讲讲缓存css是如何生成的
; F# }+ t" z6 B; {) M* v: V0 m
/ F9 V( [6 F$ O+ J5 a; N9 _common.css比较简单,就是直接读取,然后生成到data/cache目录下。
% `% d3 H+ ?& A2 Q3 f* w
5 ^+ I  ~9 K0 J+ d) D每个频道模块独立的css,会先将module.css在data/cache下生成一个对应的风格id下的缓存的css,然后当你访问某个频道时,会生成对应频道下的css,此时,刚才介绍的那些标识就起作用了。程序会根据/** group::index **/和/** end **/这种标识,拆分出哪些频道、哪些模块该需要哪些css。
7 e7 f% M, U% I- A+ q
+ K" Q. I5 S9 @! f  R$ S* ?& Y) v程序部分就不介绍了,程序的代码主要在source/class/class_template.php文件处理,有兴趣的同学可以深入研究一下。
  A: Z* a  d) x- z7 \9 J4 X. E8 P5 ?) h1 n
$ x1 I# p8 n+ a( ~- Y* s5 C
三、在模板制作中充分的运用好css加载机制,提高页面的加载速度 : \0 g* g2 C, a9 A- F, q. l5 \! N

, t) ?: T" t% W7 O+ ^8 e. \& x新建模板后同学们可以在【模板文件夹\common】中建立附加样式表并命名为:
5 g- U2 U1 S% e8 y" w1 y9 yextend_module.css
# k" l1 t8 R( k' U3 H& ]# ]extend_common.css
/ S- j. a1 E* h; m; W这两个css文件就是重新定义common.css与module.css里面的样式,这两个附加样式与上面讲的两个css文件分别合并,最终就生成css缓存文件了
$ P1 }- y3 H3 O; W, l7 o
- K+ ^6 d6 p: @6 k' _3 G. H& x+ [extend_module.css 这里面必须根据上面第二节里讲的,写好标识!! ' b& n! d' h* v

; i4 A6 I: N/ k: w9 F如果想重新定义默认模板中的一些css,那么直接在这两个文件中重写就行了。 ( G% g  e. F& k+ o- S

. e' l( I; S0 ~& ~, j% F注意:如果你的模板布局是完全要重写的,那就命名为:common.css和module.css 这样程序就只处理新模板中的css,不会与default里面的合并了
' k& Y; p9 {: D1 V, V( i

版权声明
1、转摘或引用本站内容资源须注明原网址,并标明本站网址(兔源码www.tuyuanma.com);
2、对于转摘或引用本站内容资源而引起的民事纠纷、行政处罚或其他损失,本站不承担责任;
3、对于不遵守本声明或其他违法、恶意使用本站内容者,本站保留其追究法律责任的权利。




自动排版 | 高级模式
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

广告

兔源码网 ( 赣ICP备17001544号 公网安备36112102000036号 )

兔源码 QQ交流群:493651246  GMT+8, 2019-12-9 10:12
←站长统计工具 查看密码:tuyuanma

兔源码DZ模板下载 站长邮箱:tuyuanma@qq.com 站长QQ:3197813386 网站地图

© 2001-2013 本站内容皆来自互联网及用户分享,如需删除请提供软著或商标证书。

     
快速回复 返回顶部 返回列表