Как сделать календарь в html и CSS

Для создания календаря в HTML и CSS можно использовать таблицу и стилизовать ее с помощью CSS. Вот пример кода:

HTML:

<div class="calendar">
  <table>
    <thead>
      <tr>
        <th colspan="7">есяц Год</th>
      </tr>
      <tr>
        <th>Пн</th>
        <th>Вт</th>
       th>Ср</th>
        <th>Чт</th>
       th>Пт</th>
        <th>Сб</th>
        <th>Вс</th>
      </tr>
    </thead>
   tbody>
      <tr>
        <td></td>
        <td></td>
       td></td>
       td></td>
        <td>1</td>
        <td>2</td>
        <td>3</td>
      </tr>
      <tr>
        <td>4</td>
       td>5</td>
        <td>6</td>
       td>7</td>
        <td>8</td>
       td>9</td>
        <td>10</td>
      </tr>
      <!-- продолжаем таблицу для остальных дней месяца -->
    </tbody>
  </table>
</div>

CSS:

.calendar {
  font-family: Arial, sans-serif;
  border-collapse: collapse;
  margin: 20px auto;
}

table {
  width: 100%;
}

th {
  background-color: #eee;
  font-weight: bold;
  text-align: center;
  padding: 10px;
}

td {
  border: 1px solid #ccc;
  text-align: center;
  padding: 10px;
}

td:hover {
  background-color: #eee;
}

td:first-child, th:first-child {
  border-left: none;
}

td:last-child, th:last-child {
  border-right: none;
}

tr:last-child td {
  border-bottom: none;
}

Это базовый пример, который можно доработать и стилизовать под свои нужды. Например, добавить цветовую схему, выделить текущий день или выходные дни и т.д.