首页>内容

html中选择器选择基数

网页前端

小坏蛋 / 10-13 / 评论 / 阅读 / 赞

作者有点忙，还没写简介

文章描述：

css操作基数偶数以及倍数属性

<div class="container">
<h2>数据列表</h2>
   <ul class="list-group">
      <li class="list-group-item">九品芝麻官</li>
      <li class="list-group-item">武状元苏乞儿</li>
      <li class="list-group-item">大话西游之大圣娶亲</li>
      <li class="list-group-item">少林足球</li>
      <li class="list-group-item">国产凌凌漆</li>
      <li class="list-group-item">破坏之王</li>
      <li class="list-group-item">大内密探零零发</li>
      <li class="list-group-item">整蛊专家</li>
      <li class="list-group-item">家有喜事</li>
      <li class="list-group-item">审死官</li>
      <li class="list-group-item">赌圣</li>
      <li class="list-group-item">新喜剧之王</li>
      <li class="list-group-item">算死草</li>
   </ul>
</div>

.list-group li:nth-child(odd) {
    background: #b8daff;
}
.list-group li:nth-child(even){
    background:#f5c6cb;
}

.list-group li:nth-child(3){ background:#ffeeba;}

我们还可以按照倍数来设置，我们设置5n+0表示第5个、10个、15个….颜色变为白色

.list-group li:nth-child(5n+0){ background:000;}

发布时间：2022/10/13

html中选择器选择基数

相关阅读

发表评论

最近发表