Changing the specific row's background-CodePudding

Currently, I am working on a project which is Book Store Web Application. I want to change the background of the rows like one row is grey, the next row is white and goes on like this.Also my task is doing this using CSS.

You can see in picture. I want to change the "Novel" row grey, I want the next row which is "Horror" stay white and change "Adventure" row to grey and it goes on like this. The datas come from the database one by one and I cannot reach them one by one.

CodePudding user response：

Since you are using asp.net MVC I will assume you are using bootstrap.

All you need to do is add .table-striped on <tbody></tbody>

or follow this example:

<table >
  ...
</table>

For a plain CSS solution try this:

tr:nth-child(even) {
  background-color: #f2f2f2;
}

Bootstrap 5 striped table docs: Striped table