SupeSite 7.0是康盛创想(Comsenz)公司于2009年3月推出的一款社区CMS产品，作为Comsenz旗下的社区产品SupeSite 7.0 全面支持对 Discuz!、UCenter Home 的聚合功能。对于那些已经安装使用 Discuz! 和 UCenter Home 的站长来说，通过 SupeSite 7.0 可以快速搭建一个社区门户。

　　我们以默认模板为例分析一下其模板样式，SupeSite 7.0 默认模板的样式表为 \templates\default\css\common.css，所以只需要修改该文件即可更改 default 模板样式。

　　注意：修改默认模板之前最好复制一份进行修改，保留默认的 default 目录，方便以后的产品升级。

　　1、相册首页

　　1)最近更新(幻灯片)

　　整个“最近更新”模块的边框由 .global_module 样式控制，这个参数控制很多模块的边框样式，之前的文章里我们已经做过分析了，所以此处不再赘述。

　　其在 common.css 样式表中对应的常见修改样式有：

　　#image_focus_big img { width:350px; height:276px; }

　　// 幻灯片大图大小控制

　　#image_focus_small h3 { padding:8px 15px 12px;}

　　// “最近更新”模块标题样式控制，如需修改标题字体可在此添加相应样式代码。

　　.global_piclist li div { display:table-cell; *display:block; width:102px; height:104px; *height:102px; overflow:hidden; border:1px solid #E0E9F2; background:#FFF; text-align:center; vertical-align:middle; *font-size:85px; cursor:pointer; }

　　// 幻灯片小图外框样式控制，常见修改有更改小图边框样式 border:1px solid #E0E9F2，背景色 background:#FFF，以及字体大小 font-size:85px 。

　　.global_piclist li div img, .user_photolist dl dt div img { max-width:100px; max-height:100px; width:expression(this.width > 100 && this.width > this.height ? 100: true); height:expression(this.height > 100 ? 100: true); vertical-align:middle; }

　　// 幻灯片小图样式控制，设定缩略图最大宽度和高度都为 100px，如果图片宽高大于这个数值则缩略到 100px，并且缩略图居中显示。

　　2)本月相册达人

　　“本月相册达人”模块的边框和标题背景样式均同首页资讯模块，所以此处不做赘述。

　　其在 common.css 样式表中对应的常见修改样式有：

　　.image_user_list dl dt img { width:48px; height:48px; padding:1px; border:1px solid #D8D8D8; background:#FFF;}

　　// 用户头像样式控制，常见修改有更改用户头像边框样式 border:1px solid #D8D8D8 以及更改背景色 background:#FFF 。

　　.image_user_list dl a { color:#369; }

　　// 相册名称字体颜色控制。

　　.image_user_list dl a { color:#369; }

　　// 相册所有者用户名字体颜色控制。

　　3)精彩相册

　　“精彩相册”模块的边框和标题背景样式均同首页资讯模块，所以此处不做赘述。

　　其在 common.css 样式表中对应的常见修改样式有：

　　.image_gallery_list dl { display:inline; float:left; width:284px; height:120px; overflow:hidden; margin:10px 0 10px 22px; background:url(../images/image_shadow_bg.gif) no-repeat; }

　　// 单个相册模块样式控制，常见修改有修改单个相册的高宽，以及更换其背景图片 /images/image_shadow_bg.gif 。

　　.image_gallery_list dl dt img { max-height:100px; max-width:100px; width:expression(this.width > 100 && this.height < this.width ? 100:true); height:expression(this.height > 100 ? 100:true); vertical-alig9 7 3 1 2 4 8 :

本文来源：华军资讯 作者：厂商投递