Кликабельная таблица

by Ksenia Polyakova

HTML

<table class="table">
<caption>Таблица с кликабельными ячейками</caption>
  <tr>
    <th>1</th>
    <th>2</th>
    <th>3</th>
  </tr>
  <tr class="table__line">
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
  </tr>
  <tr class="table__line">
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
  </tr>
  <tr class="table__line">
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
    <td class="table__item"><a href="#" class="table__link"></a></td>
  </tr>
</table>

CSS

.table {
   border-spacing: 0;
}

.table__item {
  width: 50px;
  height: 50px;
}

.table__link {
  display: block;
  width: 100%;
  height: 100%;
  background-color: red;
}