JSFiddle - React, Tailwind, and code Playground

by Nonamenonamevi4

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Чередующиеся квадраты</title>
</head>
<body>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</body>
</html>

CSS

body {
  display: flex;
}

div {
  width: 70px;
  height: 70px;
  margin: 10px;
  transition: 0.1s;
}

div:nth-child(2n) {
  background-color: #009abf;
}

div:nth-child(2n+1) {
  background-color: #000000;
}

div:hover {
  background-color: #ff9f19;
}