JSFiddle - React, Tailwind, and code Playground

by Rolf

HTML

<table>
<tr><td>01.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>02.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>03.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>04.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>05.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>06.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>07.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr class="we"><td>08.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr class="we"><td>09.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>10.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>11.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
<tr><td>12.05.2021</td><td>Dings</td><td>Bums</td><td>Tralala</td><td>1</td><td>2</td><td>3</td></tr>
</table>

CSS

table {
  width:100%;
  border-collapse: collapse;
}
table td {
  border: 1px solid black;
}
table td:first-child {
  width: 5em;
  
}
table tr {
  background: linear-gradient(to bottom, white 50%, #ccc 50%)
}
table tr.we {
  background: linear-gradient(to bottom, white 30%, yellow 50%, white 80%);
}