HTML image size in a table

Question

How do I leave a smaller image using HTML in this code? I already used Width after the link and it doesn’t work

<a href="window.open('file:///C:/Users/cliente/Desktop/Projeto%20Leticia/Cadastro.html')";>
  <img src= "C:\Users\cliente\Desktop\Projeto\PICON_028.png"/>
</a>

Answer 1

You can do so using CSS

img{
  width: 50px;
}

<table>
  <thead>
    <tr>
      <th>Imagem</th>
    </tr>
  </thead>
  
  <tbody>
    <tr>
      <td>
        <a href="window.open('file:///C:/Users/cliente/Desktop/Projeto%20Leticia/Cadastro.html')";><img src= "https://timedotcom.files.wordpress.com/2017/06/kit-harington-got.jpg"/></a>
      </td>
    </tr>
  </tbody>
</table>

Answer 2

The solution suggested by Rafael clarifies his doubt, however, it defines the same size for all images on the page, which is not usually an appropriate approach. To apply formatting only on this image is better:

CSS

.minha-imagem{
  width: 50px;
  height: 50px;
}

HTML

<img src= "C:\Users\cliente\Desktop\Projeto\PICON_028.png" class="minha-imagem"/>

Remember that if you insert the css inside a @media query you can define different sizes according to the screen resolution, which would be advisable to adapt the site to mobile devices such as tablets and phones. So, for example, it would look like this:

@media only screen and (max-width: 500px) {
    .minha-imagem{
      width: 50px;
      height: 50px;
    }
}