MetInfo公共信息列表制作

本页面只以最简单示例阐述信息列表的制作，函数标签的详细使用请查阅“标签函数及参数”部分。

文字信息列表

使用标签函数制作：

结合CSS控制，可以实现如下效果：

HTML代码：



 

 {$lang_News}
 //$lang_News为语言包定义参数 

{$metright}

css代码：



.index_news_list{ width:100%; height:auto; line-height:23px; _line-height:22px; margin:0px 0px 0px 0px; _margin:5px 0px 0px 0px;text-align:left; }

.index_news_list ul li{background:url(../list.gif) no-repeat 5px 8px; *background:url(../list.gif) no-repeat 5px 10px; _background:url(../list.gif)

 no-repeat 5px 7px; width:97%; height:23px; _height:22px; padding:0px 0px 0px 10px; position:relative;} 

.index_news_list ul li .info_updatetime{position:absolute; right:5px; top:0px;} 

.index_news_list ul li .info_class a{ color:#000066;} 

.index_news_list ul li img{ margin:5px 0px 0px 0px;} 

.index_news_list ul li font{ font-size:12px; color:#CC0000;}

使用PHP语言制作：

结合CSS控制，可以实现如下效果：

HTML代码：



 

{$class_index[4][name]}
  //栏目标识为4的栏目名称 

 

 

$val[title] 

$val[top] $val[news] $val[hot]
 

 

{$lang_more}…

css代码：



.index_newslist{ width:215px; margin:0px auto;} 

.index_newslist li{ height:30px; line-height:30px;_height:10px;_line-height:15px;padding-left:5px;_padding:8px 0px;} 

.index_newslist li{ background:url(../lia.gif) repeat-x bottom left;} 

.more1{ text-align:right;} 

.more1 a{ font-family:arial;} 

.index_newslist li img{} 

.index_newslist li a{ color:#555555;} 

.index_newslist li a:hover{ text-decoration:underline; color:#0099FF;}

图片信息列表（图片新闻也可以用同样的方法实现）

结合CSS控制，可以实现如下效果：

HTML代码：

 
{$metproduct}

css代码：



.index_content{width:99%; height:auto; text-align:left; padding:3px; line-height:18px; font-size:12px; margin-bottom:2px; overflow:auto; } 

.index_content a{ color:#000066;} 

.index_content li{ width:200px; height:auto; overflow:hidden; margin:10px; margin-left:18px; margin-right:18px; text-align:center; 

line-height:25px; float:left;}

滚动图片信息列表

结合CSS控制，可以实现如下不间断循环向左效果：

HTML代码：

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
$val[title]

css代码：



.advice{ width:570px; height:150px; overflow:hidden;}

category:MetInfo