CssNameA、 CssName1和 CssName2自定义CSS参数使用实例(2)_动易Cms教程

前台网页代码：
<!--本站最新文章代码开始-->
<table cellSpacing=0 cellPadding=0 <tr>
<td class=main_title_575><A class=class href="/Article/ShowNew.asp"><B>本站最新文章</B></A></td>
</tr>
<tr>
<td class=main_tdbg_575 vAlign=top <table cellpadding="0" cellspacing="0"><tr><td valign="top" class=""><img src="/Article/images/article_ontop7.gif"> <a class="" href="/Article/ShowArticle.asp?ArticleID=3241" title="[上海]都只要2000 三星飞利浦对轰17英寸液晶" target="_blank">[上海]都只要2000 三星飞利</a> (3月27日)<br /></td><td valign="top" class=""><img src="/Article/images/article_elite7.gif"> <a class="" href="/Article/ShowArticle.asp?ArticleID=3270" title="Web2.0－－新一波互联网大潮的到来" target="_blank">Web2.0－－新一波互联网大</a> (4月12日)<br /></td></tr>……

　　从前台网页代码中可以看出，在首页模板中文章列表并没有受任何CSS样式控制。

2.添加风格样式定义

　　依次点击“系统设置”->“网站风格治理”，修改后台网站风格，添加以下自己定义的CSS样式定义代码：

CSS定义： /* ******LinkA表示首页最新文章中带有链接的文字的风格样式，带下划线****** */ a.LinkA:link {color: #0000ff;text-decoration: underline;} a.LinkA:visited {color: blue;text-decoration: underline;} a.LinkA:hover{color: #ff0000;text-decoration: underline;} a.LinkA:active {color: blue;text-decoration: underline;} /* ******首页最新文章中间隔各行的风格样式，分奇数行与偶数行****** */ .LinkAbg01 /* --奇数行文章列表内容间隔颜色的定义1-- */ { background:#E3F0FB;color:#F500D0; } .LinkAbg02 /* --偶数行栏目文章列表内容间隔颜色的定义2-- */ { background:#F6FAFE;color:#ff0000; }

　　请注重：在模板中调用参数时要注重设置ShowType参数 -----显示方式（1为普通样式，2为表格式，3为各项独立式，4为智能多列式，5为输出DIV，6为输出RSS ）。在网页代码中添加的CssNameA、 CssName1和 CssName2这三个自定义CSS控制参数时，设置不同的显示方式（ShowType）参数其效果不同，这三个自定义CSS在表格式的显示方式下效果最好。

3.添加CssNameA、 CssName1和 CssName2这三个自定义CSS控制参数

　　在风格中添加好a.LinkA.LinkAbg01和.LinkAbg02这三个自定义CSS风格后，可以修改模板中的文章列表标签（{$GetArticleList(参数列表)}），在标签中添加上这三个自定义CSS风格的控制参数。

修改一：显示方式为2（表格式）

查看更多 动易Cms教程  动易Cms模板