如何为表格中特定数量的行着色? [英] How to color a specific amount of rows from a table?

问题描述

<style>     
    #font{
        font-size: 20px;
        color:#0000cd;
    }
    tr:nth-child(n+7) {
        background-color: #d3d3d3;
    }                  
    table {
       border-spacing: 0;
    }
</style>

如何仅对特定数量的行进行着色? 在这里，我显示器的前7行只有白色，其余为灰色.我想要7行白色，7灰色，7白色，7灰色等等...

How do I color only a specific number of rows? here only the first 7 lines of my display is white and the rest grey. i want 7 lines white, 7 grey, 7 white, 7 grey and so on...

推荐答案

您可以尝试以下方法:

.table>span {
  height: 20px;
  width: 20px;
  display: inline-block;
  background: red;
}

.table>span:nth-child(14n + 1),
.table>span:nth-child(14n + 2),
.table>span:nth-child(14n + 3),
.table>span:nth-child(14n + 4),
.table>span:nth-child(14n + 5),
.table>span:nth-child(14n + 6),
.table>span:nth-child(14n + 7) {
  background: blue;
}

<div class="table">
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
</div>

这篇关于如何为表格中特定数量的行着色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！