帝国cms7.2内容页模板实现多背景tag标签

李和周 2016-05-25 23:10:24 帝国CMS 492 ℃ 0 评论

帝国cms内容页代码:

<?php
$ecms_bq_sql=sys_ReturnEcmsLoopBq("select * from [!db.pre!]enewstagsdata where classid='$navinfor[classid]' and id='$navinfor[id]' order by tagid",10,24,0);
$bqno=0;
while($bqr=$empire->fetch($ecms_bq_sql))
{
$bqsr=sys_ReturnEcmsLoopStext($bqr);
$bqno++;
?>      
<?php
$ecms_bq_sql2=sys_ReturnEcmsLoopBq("select * from [!db.pre!]enewstags where tagid='$bqr[tagid]' order by tagid",1,24,0);
$bqno2=0;
while($bqr2=$empire->fetch($ecms_bq_sql2))
{
$bqsr2=sys_ReturnEcmsLoopStext($bqr2);
$bqno2++;
?>
<li class="tag-<?=$bqno?>"><a href="/e/tags/?tagname=<?=urlencode($bqr2[tagname])?>"><?=$bqr2[tagname]?></a></li>        
<?php
}
}
?>

css代码如下,自己写啊,仅供参考:

tags span{float: left;}
.tags ul li {width: auto; height: 25px; line-height: 25px; margin: 0 5px; padding: 0 5px; border: none;list-style-type: none;float: left;}
.tags a{color: #fff;text-decoration: none;}
.tags .tag-1 {background-color: #428bca;}
.tags .tag-1:hover {background-color: #4a99de;}
.tags .tag-2 {background-color: #5CB85C;}
.tags .tag-2:hover {background-color: #66c966;}
.tags .tag-3 {background-color: #D9534F;}
.tags .tag-3:hover {background-color: #eb5955;}
.tags .tag-4 {background-color: #567E95;}
.tags .tag-4:hover {background-color: #6592ab;}
.tags .tag-5 {background-color: #B433FF;}
.tags .tag-5:hover {background-color: #c972fb;}
.tags .tag-6 {background-color: #FF6600;}
.tags .tag-6:hover {background-color: #fca56c;}
.tags .tag-7 {background-color: #00ABA9;}
.tags .tag-7:hover {background-color: #02c4c2;}
.tags .tag-8 {background-color: #4A4A4A;}
.tags .tag-8:hover {background-color: #5e5d5d;}

具体效果如下:

帝国cms7.2内容页模板实现多背景tag标签

本文TAG:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

李和周个人博客