当前位置 > &>&&>&
不少网站都会有文章排行的需求，如果要做排行榜就少不了文章的排序显示，例如下图中的效果：文章排行显示效果在样式上要实现这个需求有两种方法，一种是通过css的nth-child() 选择器来控制样式实现，但是这种方式有一些浏览器是不支持的，所以我们海可以通过帝国cms的灵动标签直接输出序号来实现，然后再通过css来定义他们的样式。下面麦芽糖通过一个实际的例子来教会你怎么实现这个效果。第一步、定义好我们要的html前端源码&!--智乐前端排行榜--&
&div&class=&toplist&&
&&&&&&&&&li&&span&1&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&2&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&3&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&4&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&5&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&6&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&7&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&8&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&9&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&&&&&&&&&li&&span&10&/span&&a&href=&#&&target=&_blank&&标题&/a&&/li&
&/div&第二步、定义样式/*24小时排行榜*/
.toplist{padding-bottom:20&}
.toplist&ul{padding:&0&14}
.toplist&ul&li{margin-top:14height:&20}
.toplist&ul&li&span{float:width:&16height:&16color:&#background:&#ee2e3d;text-align:&line-height:&16margin-right:12&margin-top:2font-size:12}
.toplist&ul&li:nth-child(n+4)&span{background:ō}//通过选择器实现从第4个li开始实现不同的颜色
.toplist&ul&li&a{float:height:&20color:ȫwhite-space:&overflow:&text-overflow:width:&240font-size:14}注意，以上方式使用了选择器，虽然大部分主流浏览器都支持这个方式，但是还是有少部分浏览器是不支持的例如IE6，你如果想让所有浏览器都支持，那么可以单独去给span中的class定义一个编号，再通过样式来定义每个编号的颜色。第三步、&div&class=&toplist&&
[e:loop={'selfinfo',10,1,0}]
&li&&span&&?=$bqno?&&/span&&a&href=&&?=$bqsr['titleurl']?&&&target=&_blank&&&?=$bqr['title']?&&/a&&/li&
&/div&如果默认要要从2开始就 $bqno+1，要从3开始就 $bqno+2 以此类推&div&class=&toplist&&
[e:loop={'selfinfo',10,1,0}]
//BY&ZLTHEM.COM
//要从2开始
&li&&span&&?=$bqno?&&/span&&a&href=&&?=$bqsr['titleurl']?&&&target=&_blank&&&?=$bqr['title']?&&/a&&/li&
&/div&如果你现在对灵动标签还不够熟悉，建议先到里了解至此，你已经完全掌握了这个方法，回顾我们的第二步关于样式的问题，如果想让所有浏览器都支持显示，可以将span的class定义一个编号&span class=&num1&&1&/span&,再通过样式单独去定义。模板修改为以下方式&div&class=&toplist&&
[e:loop={'selfinfo',10,1,0}]
&li&&span&class=&num&?=$bqno?&&&&?=$bqno?&&/span&&a&href=&&?=$bqsr['titleurl']?&&&target=&_blank&&&?=$bqr['title']?&&/a&&/li&
&/div&样式修改为以下方式/*24小时排行榜*/
.toplist{padding-bottom:20&}
.toplist&ul{padding:&0&14}
.toplist&ul&li{margin-top:14height:&20}
.toplist&ul&li&span{float:width:&16height:&16color:&#background:&#ee2e3d;text-align:&line-height:&16margin-right:12&margin-top:2font-size:12}
//单独定义第4个li开始实现不同的颜色
.toplist&ul&li&num4,.toplist&ul&li&num5,
.toplist&ul&li&num6,.toplist&ul&li&num7,
.toplist&ul&li&num8,.toplist&ul&li&num9,
.toplist&ul&li&num10{background:ō}
.toplist&ul&li&a{float:height:&20color:ȫwhite-space:&overflow:&text-overflow:width:&240font-size:14}
人喜欢此文章
本文由 智乐前端 麦芽糖 原创发表，转载请注明来源地址及作者！
Hi, 欢迎加入帝国CMS技术交流群，带你装逼带你飞！
网站定制设计
设计素养决定网站大局
可以简单的理解为，通过该插件第一次访问时可以将动态或者伪静态(伪静态页面其实很大部分用的也是PHP动态页面，只是地址URL被友好的重新定义了)页面，生成一个缓存页面，第二次访问时若在插件缓存时间内，用户访问该页面查看到的均为缓存页面的内容，从而减少读取数据库频率。...
本插件是结合之前原有tag功能基础上升级改进，原有功能已保留，插件为独立管理方式不影响帝国程序升级，提供教程可以无缝对接原有tag程序，将文章发布时的tag功能切换为插件tag功能。...
我来推荐一个更牛逼的给你看看？知识改变命运，阅读提升修养，大学旁阅读网- 发现和分享 8 小时以外的 - 人物,生活,阅读,语录,文学,时评,荟萃,正能量 ！享受不一样的阅读时光~他的最新文章
他的热门文章
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)[原创]首页调用的文章标题后面加了时间该如何控制位置？
帝国cms - 安全、强大、稳定、灵活
用户头衔：秀才
精华贴&&&：0
发贴数&&&：109
经验值&&&：451
注册时间：
【】&&&[第&1&楼]
[原创]首页调用的文章标题后面加了时间该如何控制位置？
我用ＥＣＭＳ５.０，首页调用了新闻栏目文章标题，在标题后面加了时间，ecms默认的是时间紧跟在标题后面，因为标题字数长短不一，时间紧跟后面显得不美观，我希望时间不紧跟在标题后面，而是全部居右靠齐，不知道这样是要更改ＣＳＳ还是那里，希望知道的朋友帮助一下，如下两副图，我要的是把第一种效果变更为第二种效果！谢谢了！第一种效果，也就是ＥＣＭＳ默认的效果如下：
上传以下图片：
已设置保密
用户头衔：秀才
精华贴&&&：0
发贴数&&&：109
经验值&&&：451
注册时间：
【】&&&[第&2&楼]
第二种效果如下，即我想变更为的效果
上传以下图片：
已设置保密
用户头衔：进士
精华贴&&&：0
发贴数&&&：655
经验值&&&：2262
注册时间：
【】&&&[第&3&楼]
&a href=**** &dfgdfgdfgdf&/a&&span&时间&/span&css控制a居左 span居右就可以了
承接网站建设、模板制作[帝国CMS|织梦CMS|动易CMS|新云CMS]、网站筹划、网站转移等业务。
已设置保密
用户头衔：秀才
精华贴&&&：0
发贴数&&&：109
经验值&&&：451
注册时间：
【】&&&[第&4&楼]
谢谢朋友的即时回复，但我在首页模板里整块的文章标题输出就只有这么一个标签[phomenews]'15',9,60,1,0,1,'Y-m-d'[/phomenews]，如果在CSS里面控制，并没有像你说的一样的代码来控制这个标签的输出格式，能否给我做进一步的详细说明？再一次诚挚的谢谢！另外，ecms的列表页面日期是没有跟在标题后面的，整体居右靠齐，我对CSS不太熟悉，找不到控制列表的地方，要不然还是可以参考学习一下！麻烦了！
[该贴被修改 1 次，最后修改时间
10:45:29 ]
已设置保密
用户头衔：秀才
精华贴&&&：0
发贴数&&&：109
经验值&&&：451
注册时间：
【】&&&[第&5&楼]
再次顶起在线等待...谢谢！
已设置保密
用户头衔：进士
精华贴&&&：0
发贴数&&&：655
经验值&&&：2262
注册时间：
【】&&&[第&6&楼]
麻烦，用万能标签不更好。
承接网站建设、模板制作[帝国CMS|织梦CMS|动易CMS|新云CMS]、网站筹划、网站转移等业务。
已设置保密
用户头衔：版主
精华贴&&&：
发贴数&&&：21653
经验值&&&：47928
注册时间：
【】&&&[第&7&楼]
用ecmsinfo万能标签　
已设置保密
用户头衔：秀才
精华贴&&&：0
发贴数&&&：109
经验值&&&：451
注册时间：
【】&&&[第&8&楼]
太谢谢了！
已设置保密
6qvx7csu9d
用户头衔：书生
精华贴&&&：0
发贴数&&&：2
经验值&&&：16
注册时间：
【】&&&[第&9&楼]
新手，刚好看见，谢谢啦
已设置保密
使用EBB代码
使用smile代码
自动分析url
自动分析img
&&(按 Ctrl+Enter 直接提交)
Powered by：&&Version 2.2.1您当前的位置：&>&
帝国cms修改根目录名称，以前的信息缓存已经清除，现在网站文章都是成死链。请问，如何一键改变已有文章的目录？？？后台&系统&数据更新&更新信息页地址：更新数据表中的内容页地址
最新帝国CMS教程
推荐帝国CMS教程
热门帝国CMS教程