资讯专栏INFORMATION COLUMN

如何做到一个list中奇数和偶数行的背景色不一样?

tianhang / 2087人阅读

摘要:若是用原生就要判断,例如元素行数奇数行代码偶数行代码而且用也可以添加奇偶数行的样式,例如元素为的奇偶设置

若是用原生js就要判断,例如
for(var i = 0; i < 元素行数; i++){
if(i%2 == 0){
//奇数行代码
}else{
//偶数行代码
}
}
而且用css也可以添加奇偶数行的样式,例如元素为tr的奇偶设置
tr:nth-child(odd){background:#0f0;}
tr:nth-child(even){background:#ff0;}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/114968.html

相关文章

  • 前端每日实战:157# 视频演示如何用纯 CSS 创作一个棋盘错觉动画

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 showImg(https://segmentfault.com/img/bVbigC0?w=400&h=299); 效果预览 按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehop...

    Rainie 评论0 收藏0
  • 前端每日实战:157# 视频演示如何用纯 CSS 创作一个棋盘错觉动画

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 showImg(https://segmentfault.com/img/bVbigC0?w=400&h=299); 效果预览 按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehop...

    shleyZ 评论0 收藏0
  • 前端每日实战:157# 视频演示如何用纯 CSS 创作一个棋盘错觉动画

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 showImg(https://segmentfault.com/img/bVbigC0?w=400&h=299); 效果预览 按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehop...

    soasme 评论0 收藏0
  • 翻译 | 一行 JavaScript 代码的逆向工程

    摘要:下一步,我声明了变量和,然后把他们放在函数的顶部。注意,我将上述的剩余部分重命名为。会返回一个从开始的整数,并且每次执行完之后返回值都会递增。行之后超过了,使得结果发生了变化。这和我们的预期一致。这一时刻的数量已经增长了一定的数量。 原文地址:Reverse Engineering One Line of JavaScript 原文作者:Alex Kras 译者:李波 校对者:冬...

    wupengyu 评论0 收藏0
  • CSS选择器之:nth-child(n)与:nth-last-of-type(number)

    摘要:功夫不负有心人,找到了选择器。定义和用法选择器匹配属于其父元素的第个子元素,不论元素的类型,从第一个子元素开始计数第一个子元素的下标是,不要和混淆,是。 这段时间在做一些东西,整理了其中遇到的一个关于CSS选择器的问题。 需要完成一个下图的侧边栏效果: showImg(https://segmentfault.com/img/bVuDuY); 乍一看,很简单嘛,标签列表、弹框,完工! ...

    roland_reed 评论0 收藏0

发表评论

0条评论

阅读需要支付1元查看
<