Как сделать все фоновое изображение кликабельным?

Question

Я пытаюсь отправить изображение по электронной почте, поэтому я хотел, чтобы все изображение было кликабельным. я ожидаю, как я структурировал код, потому что другой формат не поддерживает.

  <div class="container" style="background: url('https://firebasestorage.googleapis.com/v0/b/growthfilepractice.appspot.com/o/1%20(2).jpg?alt=media&token=48244df9-a2bb-412a-81f5-854e2dbc4939');background-repeat: no-repeat;background-size:500px 500px;height: 500px;margin-left: 20%;">
    <a href ="https://github.com/" style="text-decoration: none;">
      <table>
        <tr>
          <td><h3 style="color: #fff;margin-top: 195px;margin-left:60px;font-weight: 600;font-family:Montserrat;">xyz</h3></td>
        </tr>
        <tr>


        </tr>
      </table>
    </a>
  </div>

Answer 1

<a href ="https://github.com/"  style="width: 500px;height: 500px; position: relative; margin-left: 20%;text-decoration: none; display: block;">
  <img src="https://firebasestorage.googleapis.com/v0/b/growthfilepractice.appspot.com/o/1%20(2).jpg?alt=media&token=48244df9-a2bb-412a-81f5-854e2dbc4939" style="position: absolute; width: 100%; height: 100%;  object-fit: contain; object-position: left top; z-index: -1;">
  <table style="position: relative; z-index: 1;">
    <tr>
      <td><h3 style="color: #fff;margin-top: 135px;margin-left:60px;font-weight: 600;font-family:Montserrat;">xyz</h3></td>
    </tr>
    <tr>


    </tr>
  </table>
</a>