Zebra Table css и html?

Question

мне нужно сделать эту таблицу в CSS:

мне нужна помощь, пожалуйста, я не знаю, как это сделать.

Answer 1

Вы можете использовать :nth-of-type(odd) для этого.

tr:nth-of-type(odd) {background-color: green;} 

Answer 2

Замените данные как довольные, в идеале какой-то код на вашем конце будет лучше. Дайте классу highlight выделенному tr s. Обратите внимание, что этот пример включает загрузочный 3-минутный CSS.

.highlight { 
 
    background-color: lightgreen; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="container"> 
 
    <table class="table table-bordered"> 
 
    <thead> 
 
     <tr> 
 
     <th>Firstname</th> 
 
     <th>Lastname</th> 
 
     <th>Email</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr class="highlight"> 
 
     <td>John</td> 
 
     <td>Doe</td> 
 
     <td>john@example.com</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Mary</td> 
 
     <td>Moe</td> 
 
     <td>mary@example.com</td> 
 
     </tr> 
 
     <tr class="highlight"> 
 
     <td>July</td> 
 
     <td>Dooley</td> 
 
     <td>july@example.com</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>