Art2008CMS/Art2008CMS模版的CSS设计

之前讲过从零开始学Art2008CMS模板，用户对Art2008CMS模板设计的方法有一定的了解，但是对css控制新闻列表中各元素户具体的写法不是 很清楚，这里跟大家做一个讲解：

步骤一

在模板中插入标签：模板是前台网面效果的基础，在程序中Template文件夹下，是网站所有页面的模板,一般情况下我们会把控制页面的css样式写在一个文件下，然后在模板中调用 ，比如在Template/css/style.css文件，需要说明的是在Template/css/文件夹下有两个文件，一个是css.css它里面的样式是程序系统必要的样式，控制这各个功能页面的效果，具体有说明，如果需要修改按照说明修改，不能修改要是名称，只能修改其参数；另一个是style.css，这个文件是用户自定义页面样式，可以任意修改或添加；我们今天讲的内容就是修改这个文件！

• 在模板中首先需要连接style.css这个样式文件，不然的话这个样式表中的样式就不起作用；具体代码如下：

<link rel="stylesheet" type="text/css" href="#HOPE_InstallDir#Template/css/ style.css">

• 模板中插入标签的方法很简单，上一节我们已经讲过：

(一)：
<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td class= NewsList1>#HOPE_NewsList(0,0,0,0,0,0,10,15,1,0,0,0,10,0)#</td>
 </tr>
</table>
（二）
<DIV class= NewsList1>#HOPE_NewsList(0,0,0,0,0,0,10,15,1,0,0,0,10,0)#</DiV>

• 在这里的NewsList1是对这个列表进行样式控制的样式名称

步骤二

• 在style.css文件中添加控制这个列表的样式参数：
• CSS代码：

    .NewsList1{ padding:2px; width:488px}  /* 整体宽度*/    
    .NewsList1 .NewsList_title{ float:left} /* 列表标题控制*/          
    .NewsList1 span.NewsList_time{ float:rightright}    
    /* 时间对齐控制*/       
    .NewsList1 li{ background:url(../images/icon/ico_3.gif) 
    no-repeat center left; padding-left:20px; list-style:none}    
    /* 列表标题前图标控制*/    
    .NewsList1 .NewsList_lmname { } /* 栏目名称控制*/     
    .NewsList1 .NewsList_more { }  /* 显示'更多'控制*/   

• 每个元素的样式名称可以到标签辅助工具上找到！

• 通过这段就可以控制文章列表的显示效果了，比如字体大小颜色，列表的行距，时间的对齐方式，等等，具体参数还需用户自己根据需要添加。

• 值得注意的是要想把网站设计得很好，用户还需掌握一些关于 DIV+CSS 设计的相关知识，只有这样才能真正做到得心应手！

参考来源

• http://www.art2008cms.com/html/install/

Art2008CMS使用手册导航
安装与配置： 系统安装说明 | 安装架设站点配置IIS | WindowsXP用户设置目录权限 | WindowXP用户安装教程 | 在不同环境下安装与配置IIS | Art008CMS(Free)v4.x的安装 系统功能使用： 模版文件与功能说明 | Art2008CMS模板使用 | Art2008CMS模版的CSS设计 | 评选功能的使用 | 设置个性的列表效果 | 管理员权限的设置 | 文章阅读权限的设置 | 文章评选功能的设置 | 视频插入 | 调用图片标题 | 其他功能 常见问题： 服务器常规设置页面无法显示 | FLV视频在服务器上无法播放 | 系统提示不允许父路径 | IIS6.0服务器架站系列问题 | ART2008其他常见问题 Art2008CMS其他： 程序安全设置 | 系统建站流程图 | 常用标签列表 | 函数标签参数说明 | 把ACCESS数据导入到SQL数据库