:nth-child(n) 選擇器匹配父元素中的第n個(gè)子元素。n可以是一個(gè)數(shù)字，一個(gè)關(guān)鍵字，或者一個(gè)公式

隔行變色公式：

偶數(shù)：        :nth-child(2n)

奇數(shù)：        :nth-child(2n-1)

<style>
 
        table{
 
            /* border: 1px solid gainsboro; */
 
            border-collapse: collapse;      /*合并單元格的邊框 */
 
            width: 800px;
 
            text-align: center;
 
        }
 
        th,td{
 
            /* border: 1px solid gainsboro; */
 
            height: 30px;
 
        }
 
        /* th{
            border: none;                /*沒有邊框*/
 
        } */
 
        thead tr{
 
            background-color: #000;
 
            color: #fff;
 
        }
 
        td{
 
            border-bottom: 1px solid red;
 
        }
 
        tbody tr:nth-child(2n){
 
            background-color: rgb(112, 198, 231);
 
        }
 
        tbody tr:nth-child(2n):hover{
 
            background-color: rgb(54, 221, 152);
 
        }
 
        tbody tr:hover{
 
            background-color: rgb(247, 133, 203);
 
        }
 
    </style>

掃描二維碼手機(jī)查看該文章