鸥飞007 | 2009-10-03 04:28 | ●文章列表标签GetArticleList中增加链接文字和表格间隔背景的自定义CSS控制参数。 文章的列表标签GetArticleList增加CssNameA、CssName1、CssName2三个可选的风格参数,用以控制链接文字、奇数表格行背景、偶数表格行背景。利用这三个新参数,您可以自定义任意定义任何一个您所调用的文章列表标签中的文字与表格样式。 如: {$GetArticleList(1,0,True,0,True,15,False,False,"",0,3,2,38,0,False,1,True,False,3,False,False,False,False,False,True,0,0,aaa,bbb,ccc)} 请注意以上红色的4个参数: '26 Cols ----每行显示标题的的列数,超过此列数标题就换行。可缺省参数。在填写了后面的可缺省参数时,本参数不能缺省。 '27 CssNameA ----自定义列表标签中链接文字风格设置。在后台风格中的定义为a.***。 例: /* 自定义列表标签链接文字颜色定义 */ a.aaa{text-decoration: underline;} a.aaa:link {color: blue;FONT-SIZE: 12pt;} a.aaa:visited {color: blue;FONT-SIZE: 12pt;} a.aaa:hover{color: blue;FONT-SIZE: 12pt;} a.aaa:active {color: blue;FONT-SIZE: 12pt;} '28 CssName1 ----自定义列表标签中奇数表格行背景。 例: .bbb /* --自定义列表标签中奇数表格行背景颜色定义-- */ { background:#ff0000;height: 22;font-size:12pt;color: blue; } 2、CSS控制参数的使用说明:
(1)自定义更改有链接的文字样式:
以前我们无法更改文章列表标签GetArticleList中的文字的大小,即使要改,也是更改整个网站的风格中“a”的CSS定义。 我们知道,在CSS中是用4个伪类来定义定义有链接的文字,分别是:a:link、a:visited、a:hover和a : active(这4个伪类分别定义了"链接、已访问过的链接、鼠标停在上方时、点下鼠标时"的样式。注意,必须按以上顺序写,否则显示可能和你预想的不一样。记住它们的顺序是“LVHA”。),这个控制了整个网站中有链接的文字效果。 如果要单独定义与不同的有链接的文字的样式,在风格中需要单独添加“a.***”的CSS定义,如在风格定义中增加下面的定义: /* 自定义列表标签链接文字颜色定义 */ a.aaa{text-decoration: underline;} a.aaa:link {color: blue;FONT-SIZE: 12pt;} a.aaa:visited {color: blue;FONT-SIZE: 12pt;} a.aaa:hover{color: blue;FONT-SIZE: 12pt;} a.aaa:active {color: blue;FONT-SIZE: 12pt;} 然后在您所要调用的地方调用这个风格名“aaa”。请注意,这个调用必须是放在链接代码<A>中的。如:<A class=aaa>。 SP1在文章列表标签GetArticleList中增加了自定义CSS控制参数CssNameA,以专门控制文章列表标签中所需要单独显示的链接文字的样式,这个参数是个变量参数,也就是只要在后台风格管理中加上定义,就可在GetArticleList标签中调用您定义的风格名称。 具体的操作方法: a) 添加自定义定义:进入系统后台,请依次单击[系统设置]-[网站风格管理]-[修改风格],在“风格配色设置”内容框中加上链接定义,如上面例举的。添加完成后单击页面底部[保存修改结果]按钮,以保存所做的修改。 b) 修改列表标签参数:以修改“网站首页模板”为例,请依次单击[系统设置]-[网站通用模板管理]-[修改模板],修改模板中文章列表标签GetArticleList中的参数,如{$GetArticleList(1,0,True,0,True,15,False,False,"",0,3,2,38,0,False,1,True,False,3,False,False,False,False,False,True,0,0,aaa)}。修改完成后单击页面底部[保存修改结果]按钮,以保存所做的修改。如果您开启了生成HTML功能,则会自动生成相关页面。 请注意,在填写了CssNameA这个可缺省参数时,原Cols 可缺省参数( Cols ----每行显示标题的的列数,超过此列数标题就换行)就不能缺省。 c) 在前台页面中刷新一下,则可看到修改结果。本例将在修改过的文章列表的显示中,有链接的文字将显示显示蓝色、有下划线、12pt的文字样式。
(2)自定义日期文字样式与表格间隔背景:
如果您在GetArticleList标签中显示了日期,现在您看到的列表是文章后面的日期可能是黑色。前面已经说了,日期的颜色以前是在组件中固定成灰色,所以不能更改。现在您可以利用CssName1、CssName2这二个可选的风格参数,用以控制无链接文字的样式、奇数表格行背景、偶数表格行背景。 CssNameA这个可选择风格参数只控制有链接文字的样式,而无链接文字的样式则交给CssName1、CssName2这二个可选的风格参数来进行。 具体的操作方法: a) 添加自定义定义:进入系统后台,请依次单击[系统设置]-[网站风格管理]-[修改风格],在“风格配色设置”内容框中加上链接定义,如: .bbb /* --自定义列表标签中奇数表格行背景颜色定义-- */ { background:#ff0000;height: 22;font-size:12pt;color: blue; } .ccc /* --自定义列表标签中奇数表格行背景颜色定义-- */ { background:#0000ff;height: 22;font-size:12pt;color: blue; } 如果在这个定义中定义了文字颜色(color:),则列表标签中无链接的文字的颜色都会受此控制,如日期、子栏目名前后的“[]”。 添加完成后单击页面底部[保存修改结果]按钮,以保存所做的修改。 请注意,在填写了CssName1这个可缺省参数时,原Cols 和CssNameA可缺省参数就不能缺省。如果填写了CssName2这个可缺省参数时,原Cols 、CssNameA和CssName2可缺省参数就不能缺省。 b) 在前台页面中刷新一下,则可看到修改结果。本例将在修改过的文章列表的显示中,无链接的文字(包括日期、子栏目名前后的“[]”与其它无链接的文字)将显示显示蓝色、12pt的文字样式。奇数表格行背景、偶数表格行背景将显示红色、蓝色间隔背景。 !本功能也可以设置文章列表的行间距。
(2)自定义最新文章后日期文字样式:
最新文章后日期文字的颜色为红色,其文字大小受CssName1、CssName2这二个可选的风格参数控制。如果要更改最新文章后日期文字的颜色,请在语言包中更改。 具体的操作方法: a) 打开语言包文件:打开网站目录找到language/gb2312.xml这个文件,用记事本打开这个文件,找到ARTICLELIST定义中的UPDATETIMECOLOR_NEW中的“color=red”,将color=red改成您想要的颜色定义,如color=#0000ff。 b) 修改完成后保存这个文件,并上传到空间的相应目录中。 | |