下载鸥 > 网站下载 > 开发教程 > 帝国CMS

帝国cms彩色tag标签样式分享

425 2021-05-28 20:00:02

收藏
帝国cms标签列表如果做死板的展示可能不大好看,如果能增加一些色彩,无疑会让页面更加灵动。但帝国cms怎样给tag列表增加色彩呢?

帝国cms彩色tag标签样式分享
 

帝国cms标签列表彩色文字模板html部分

<ul class="colorful">
    <li>
        <a href="/tags-<?=$bqr[tagname]?>-0.html"><?=$bqr[tagname]?></a>
    </li>
</ul>
 

帝国cms标签列表彩色文字模板css部分

.colorful {
    margin-left: -10px;
    padding-top: 15px;
    overflow: hidden;
}

.colorful li {
    float: left;
    margin: 0 0 10px 10px;
    height: 25px;
    overflow: hidden;
}

.colorful li a {
    display: block;
    color: #fff;
    line-height: 24px;
    padding: 0 9px;
    color: rgb(242, 160, 161);
    font-size: 14pt;
}

.colorful li:nth-of-type(2n) a {
    color: rgb(132, 185, 203);
    font-size: 13pt;
}

.colorful li:nth-of-type(3n) a {
    color: rgb(205, 140, 92);
    font-size: 12pt;
}

.colorful li:nth-of-type(4n) a {
    color: rgb(248, 184, 98);
    font-size: 11pt;
}

.colorful li:nth-of-type(5n) a {
    color: rgb(165, 154, 202);
    font-size: 10pt;
}

.colorful li:nth-of-type(6n) a {
    color: rgb(165, 143, 134);
    font-size: 14pt;
}

.colorful li:nth-of-type(7n) a {
    color: rgb(136, 203, 127);
    font-size: 13pt;
}

.colorful li a:hover {
    opacity: .8;
    filter: alpha(opacity=80);
}
 

彩色tags操作方式

.colorful是父栏目ul的类名,里面是li + a标签的组合,按照这样组合好标签的循环后,加入上方的css,即可实现帝国cms标签列表tag彩色化。
 

附注

本方案并非针对帝国cms,其他程序同样适用。

本文地址:https://xzo.com.cn/develop/empire/994.html

有帮助,很赞!

信息来源:下载鸥
导出教程 下载word版教程
发表评论 共有条评论
关于帝国CMS


帝国cms是一款功能极为强大的cms程序,性能强悍、安全性高,可轻松支持10万数据,高级开发人员可制作出能容纳千万数据量的网站,是国内最出色的开源cms程序之一,推荐企业用户使用

当前最新版本为7.5,8.0版本即将上线,新版本的核心优化点在于多终端的适配。

推荐帝国CMS开发教程
忘记帝国CMS账号/密码/认证码如何重置
忘记帝国CMS账号/密码/认证码如何重置

部分用户一段时间没有登录后台,或是换了机器忘记了帝国CMS账号/密码/认证码,...

16 1089
帝国CMS百度推送插件怎样将默认ID排序改为时间倒序?
帝国CMS百度推送插件怎样将默认ID排序改为时间倒序?

很多采集站点可能是这样操作的:采集好的资讯时间是采集时间,到了发布的时候会...

19 627
帝国CMS怎样做百万、千万级别数据库的网站?
帝国CMS怎样做百万、千万级别数据库的网站?

帝国CMS作为最强大的开源cms之一,其程序效率毫无疑问。但,帝国CMS真的可以做...

19 1322
帝国CMS有栏目seo标题吗,在哪里设置?
帝国CMS有栏目seo标题吗,在哪里设置?

很多用惯了织梦CMS的朋友在用帝国以后就会非常困惑,因为织梦CMS他的栏目是有...

1 354
帝国CMS精准像素美化版怎样修改网站名
帝国CMS精准像素美化版怎样修改网站名

帝国CMS官方默认后台挺难看的,如果自用还可以,给客户则可能让客户怀疑你的审...

1 411
帝国CMS怎样验证后台发布信息标题是否重复?
帝国CMS怎样验证后台发布信息标题是否重复?

想要在帝国cms后台禁止发布标题相同的信息,或是在发布信息时验证一下标题是...

2 651
帝国cms生成效率低速度很慢怎么办?
帝国cms生成效率低速度很慢怎么办?

今天有客户联系鸥哥,说网上买的帝国cms模板生成效率很低。网站数据只有5万条...

22 2604
帝国cms外部引入百度统计代码防止被刷统计后台广告优化
帝国cms外部引入百度统计代码防止被刷统计后台广告优化

百度统计后台的广告十分猖獗,而百度统计提供的屏蔽规则并不好用,这个时候,我们...

0 465
推荐插件
帝国cms访问统计ip地址链接与封禁插件下载
帝国cms访问统计ip地址链接与封禁插件下载

下载鸥开发了这款帝国cms封禁ip插件,自动记录访问情况,让我们可以更快的识别...

0 969
帝国cms百度AI图像清晰度增强api接口对接插件
帝国cms百度AI图像清晰度增强api接口对接插件

通过本插件,可以实现帝国cms网站对接百度云api实现图像清晰度增强的功能。经...

0 497
帝国cms多栏目多数据表自动审核推送插件
帝国cms多栏目多数据表自动审核推送插件

本插件基于帝国cms帝国cms每日自动审核插件,在自动审核指定条数信息的基础上...

0 880
帝国cms百度AI图像无损放大api接口对接插件
帝国cms百度AI图像无损放大api接口对接插件

通过本插件,可以实现帝国cms网站对接百度云api实现图像无损放大的功能。经过...

0 410
帝国cms纳米数据接口(足球比赛中最新数据)
帝国cms纳米数据接口(足球比赛中最新数据)

帝国cms 对接纳米数据(www.nami.com)接口,本接口主要接收、整理足球比赛实时数...

0 331
帝国cms批量添加后台用户插件
帝国cms批量添加后台用户插件

使用帝国cms的企业用户、新闻资讯类站点的用户很多,此类站点很多时候需要有...

0 698
帝国cms自动生成文章新闻目录插件下载
帝国cms自动生成文章新闻目录插件下载

用户体验是我们的需求,百度蜘蛛的认可更是我们的需求。毕竟,没有收录排名,何来...

0 1080
帝国cms联想词搜索高级搜索插件下载
帝国cms联想词搜索高级搜索插件下载

帝国CMS自带的搜索功能虽然强大,但也有很强的局限性 -- 必须关键词完全匹配...

0 695
客服QQ:341553759
扫码咨询 常见问题 >
官方交流群:90432500
点击加入