首页 » DLE » [模板知识] Datalife Engine程序一些内置功能的CSS样式列表

[模板知识] Datalife Engine程序一些内置功能的CSS样式列表

 

认真看了《Datalife Engine模板文件列表及相关说明》 一文的同学,肯定发现了一个比较特殊的地方,那就是Style文件夹下面的engine.css样式表文件,为什么已经有了总模板的styles.css 文件,还要单独列一个engine的样式表呢?其实这个样式表,就是DLE程序自带的一些模块,比如日历、PM相关、Tags标签云等的CSS输出样式, 一般如果要求不高可以不去修改这个文件,不过对于一个完美主义者来说,熟悉这个文件,肯定能为你的模板锦上添花!

一、模块功能及对应CSS样式的ID或类对照表

1.日历相关
.calendar - 站点日历
.monthlink - 月份链接
.day-active-v - 日期为工作日且链接到日期文章列表(链接)
.day-active - 日期为周六或周日(链接)
.day - 日期为工作日但没有文章(非链接)
.weekday - 日期为周六或周日但没有文章(非链接)
.day-current - 月份链接当前日期或用户正在浏览该日期文章列表(链接)

2.月份存档相关
.archives - 月份存档列表

3.自定义字段相关
.xfields - 添加文章时自定义字段的样式

4.评级相关
.rating - 文章5级评级对应的输出样式

5.文章内代码或引用
.quote - 文章内引用内容的样式
.scriptcode - 文章内代码内容的样式

6.站内短信pm相关
.pm - 收件箱表格样式
.pm_head - 收件箱表格表头标题
.pm_list - 收件箱表格短信息列表
.pm_progress_bar - 已存短信容量占用户限制容量的百分比进度条
ID#newpm, #newpmheader -  日期为周六或周日但没有文章(非链接)用户收到新短信后,浏览站点会弹出对话框,这两个ID即对话框的框架和标题

7.编辑及按钮相关  
ID#dropmenudiv - 日期为工作日但没有文章(非链接)管理员或作者点击文章编辑按钮时的下拉菜单样式
.editor_button,.editor_buttoncl,.editbclose, .editor_button_brk- 快速编辑站点文章时的BBcode按钮及对话框样式
.editor- 发布评论时的BBcode编辑器样式

8.标签云关键词控制
.clouds_xsmall, .clouds_small, .clouds_medium, .clouds_large, .clouds_xlarge- 月份链接当前日期或用户正在浏览该日期文章列表 (链接) 根据tag词下的文章数量来对tag词归类,参与的文章最多的用xlarge,最少的xsmall,一共5个级别,可以分别定义他们的字体相关的样式

9.文章内缩略图放大后原图展示效果
.highslide-active-anchor, .highslide-image-blur, .highslide-html-content, .highslide-loading, a.highslide-full-expand, .highslide-display-block, .highslide-display-none- 月份链接当前日期或用户正在浏览该日期文章列表 (链接) 对于文章内的缩略图,点击后出现原始图,以上类可以分别定义不同的属性

10.文章内缩略图点击后展示相册相关
.highslide-dimming - 文章内缩略图点击放大完成后,相册展示时的背景样式

11.文章内代码或引用
ID#loading-layer - 文章内引用内容的样式 DLE采用AJAX技术,处于内容加载期的样式

12.快速搜索功能开启后推荐文章样式
ID#searchsuggestions - 文章站点开启快速搜索功能后,在搜索框输入关键词即可推荐几篇最相关的文章出来

13.文章内代码或引用
.mass_comments_action - 在前台批量处理(如批量处理文章评论)时的复选框样式

二、几点说明

1.除非你全新制作模板,否则请以工具书的形式参考上面的说明,即用到那个样式再过来看具体是那个类或ID,不用仔细浏览和研究这些样式。
2.本文没有实例,因为DLE系统自带的三套模板就是很好的实例了,呵呵,如果需要DEMO,请参考自带模板的engine.css样式。

原文链接:[模板知识] Datalife Engine程序一些内置功能的CSS样式列表,转载请注明来源!

0