然后查看生成的源代码,控制代码如下:



#jiaodian{}
#jiaodian ul{ margin:0;padding:3px}
#jiaodian ul li{list-style:none; line-height:21px}
#jiaodian ul li a:link,#jiaodian ul li a:visited{font-size:12px;color:#0066CC; text-decoration:none}
#jiaodian ul li a:hover{color:#ff0000;text-decoration:underline}



再补充一下,之前有看到网友需要对列表后面的日期样式进行控制,我这边也顺便提一下吧~~~~



#jiaodian ul li span{font-size:12px;color:red}/*参数自己控制*/




看中间部份的头条,这个效果是调用一个自定义sql函数标签的,大家可以在论坛上看到很多有关sql标签的教程,我这边把代码帖上来吧



建标签命名为:首页头条



查询语句:select top 1 id,title,intro from KS_Article where verific=1 and strip=1 order by id desc



循环体:(调用一条)



[loop=1]

把标签插入模板后查看源文件,控制样式如下:



#shijue{}
#shijue ul{ margin:0;padding:3px}
#shijue ul li{list-style:none;float:left;padding:2px;}
#shijue ul li a:link,#shijue ul li a:visited{font-size:12px;color:#0066CC; text-decoration:none;font-weight:bold; text-align:center}
#shijue ul li a:hover{color:#ff0000;text-decoration:underline}
#shijue ul li img{border:#999999 1px solid;padding:1px;margin-bottom:7px}



教育培训与焦点新闻是一样的,这边就不重复了....









(推荐)KesionCMS V5.X在线手册及word文档下载 支持(0) 中立(0) 反对(0)  单帖管理 举报帖子
| 引用 | 回复 |   
CMS2007 小大  5楼 个性首页 | 信息 | 搜索 | 邮箱 | 主页 | UC  





加好友  发短信





等级：超级版主

贴子：2473

积分：15386

威望：0

精华：1

注册：2007-8-7 16:05:00
     Post By：2008-9-23 13:54:00

最近很忙，没时间写，希望大家可以借鉴以上教程进行举一反三，科汛在易用性方面绝对是５星级的．



接下去讲



我们看接下来的位置放的是广告位，如果是常期不变的广告我们可以直接把图片插入到模板．但是为了方便管理，建议还是用科汛的广告系统进行管理，使用非常方便，可以参考官方站首页右上部的5.x使用手册广告系统的相关教程．



下边三行我是做成一样的风格．



这边讲一下社会新闻的做法．



模板中我们把这个表格分成两格，上部份用来放图片文章标签 {LB_社会图片新闻}，下部份放文章列表 {LB_社会新闻}．



图片文章依旧用的是图片文章列表标签，系统后台建立的系统函数标签中选择div输出，然后在id后边输入tpxw，然后针对生成的代码对tpxw进行控制．



#tpxw{}
#tpxw ul{ margin:0;padding:3px}
#tpxw ul li{list-style:none;float:left;padding-left:5px}
#tpxw ul li img{padding:1px;border:#999999 1px solid;margin-bottom:5px}
#tpxw ul li a:link,#tpxw ul li a:visited{font-size:12px;color:#0066CC; text-decoration:none; text-align:center;font-weight:bold}
#tpxw ul li a:hover{color:#ff0000;text-decoration:underline}



文章列表是一样的道理，样式控制如下：

#shxw{}
#shxw ul{ margin:0;padding:3px}
#shxw ul li{list-style-type:none; line-height:21px}
#shxw ul li a:link,#shxw ul li a:visited{font-size:14px;color:#0066CC; text-decoration:none}
#shxw ul li a:hover{color:#ff0000;text-decoration:underline}


而文化，娱乐，生活，时尚的上半部份调用的也是图片文章列表，只是选择的样式不同，这边选择的样式三．



上半部调用的是系统函数标签 {LB_文化图片}



下半部的文章列表就是系统函数标签 {LB_文化}



看看科汛系统的标签，看到这里，相信很多人都会了．有的说是恍然大悟，说不是吧，怎么这么简单啊．没错啊，这就是科汛系统受到这么多用户的喜爱的又一个原因了，就是这么简单．



如何对这两种标签进行控制，图片文章这边我们用到的新的一招，这个点我控制了好长时间，想不出来，还要感谢小林的点津了．．．



样式如下：



#whtp{}
#whtp ul{ margin:0;padding:3px}
#whtp ul li{list-style:none;position:relative}
#whtp li h2{position:absolute;top:5px;right:26px;}
#whtp li p{position:absolute;width:250px;top:25px;right:6px;}
#whtp img{border:1px solid #999999;padding:2px}
#whtp ul li a:link,#whtp ul li a:visited{font-size:12px;color:#0066CC; text-decoration:none;padding:1px;}
#whtp ul li a:hover{color:#ff0000;text-decoration:underline}



文章列表样式：


#wenhua{}
#wenhua ul{ margin:0;padding:3px}
#wenhua ul li {list-style:none;}
#wenhua ul li a:link,#wenhua ul li a:visited{font-size:14px;color:#0066cc; text-decoration:underline; line-height:22px}
#wenhua ul li a:hover{color:#FF0000}






一样的我就不说了，再看一下＂最新博客＂这块的



总有网友问我如何控制导航图片与文章标签的距离，今天这边就有利用到了，一起讲了吧



这边调用的是个人空间里的标签，{LB_最新空间}



为了控制这个导航图片与文章标题之间的距离，为了让它看起来更完美，我还是选择div输出，id="space"



标签放入模板后，查看生成的代码控制样式如下：





#space{}
#space ul { margin:0;padding:3px}
#space ul li{ list-style-type:none;padding:2px;}
#space ul li img{ padding-right:5px}
#space ul li a:link,#space ul li a:visited{ font-size:14px; color:#0066CC; text-decoration:none;padding-left:5px}
#space ul li a:hover{ color:#ff0000; text-decoration:underline}




最后就是友情链接部份和网站版权了.



（这边顺便说一下，如果你用的是科汛的免费版程序，网站上的版权如果改动了，希望你在友情链接位置给科汛做上链接）



细心的站长会发现，友情链接标签没有div输出选项，那要如何控制呢？



我们在控制标签的表格里转置入一个id=flink，如下：



友情链接：
{LB_友情链接}



然后再对这个flink进行样式控制如下：



#flink{padding:5px;color:#555;}
#flink a:link,#flink a:visited{padding:5px;color:#333; text-decoration:none}
#flink a:hover{color:#ff0000; text-decoration:none}


网站版权信息科汛ＣＭＳ是直接通过{$GetCopyRight}这个标签直接调用就行了．



如果需要更改版权信息的是在科汛系统后台的基本信息设置选项．