栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS > CSS教程

css3隔行变换色实现示例

CSS教程 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

css3隔行变换色实现示例


复制代码代码如下:


无标题文档

#list1 li:nth-of-type(odd){ background:#00ccff;}奇数行
#list1 li:nth-of-type(even){ background:#ffcc00;}偶数行
#list2 li:nth-child(4n+1){ background:#00ccff;}从第一行开始算起 每隔4个(包含第四个)使用此样式
#list00000 li:nth-child(4n+2){background:#090;}从第二行开始算起 每隔4个(包含第四个)使用次样式
#list00000 li:nth-child(4n+3){background:#009;}从第三行开始算起 每隔4个(包含第四个)使用次样式
#list00000 li:nth-child(4n+4){background:#990;}从第四行开始算起 每隔4个(包含第四个)使用次样式





  • 1111111前端路上是懒人建站的多人博客

  • 222222222222CSS3隔行换色测试

  • 333333333提供jquery 教程实例学习代码、html5教程实例和css/css3教程实例学习代码。

  • 44444444前端路上博客的灵魂:学习、发现、分享、交流

  • 55555555555555

  • 66666666666666666





  • 1111111前端路上是懒人建站的多人博客

  • 222222222222CSS3隔行换色测试

  • 333333333提供jquery 教程实例学习代码、html5教程实例和css/css3教程实例学习代码。

  • 44444444前端路上博客的灵魂:学习、发现、分享、交流

  • 55555555555555

  • 66666666666666666




转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/217131.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号