# Exercícios

Abaixo vamos apresentar alguns exercícios para você treinar HTML. Na aba "Exercício X" (sendo X o número do exercício) tem o que você deve executar. E na aba "Resposta" o código completo para você conferir.

{% tabs %}
{% tab title="Exercício 1" %}
Faça uma página HTML que exiba o seguinte resultado:

![](https://lh4.googleusercontent.com/8sPOsprum_9YzTxdtE8jG3Ivebvmqe-uFq7fdZwq0per9decwRCngVE-nTg-EqJJldeHuLdms1zP832edY8l_5u_mA3X4XHXfhGTsERW7rqQESUTUOeMdfezob5z25fGcO1dtqsNN9s)
{% endtab %}

{% tab title="Resposta" %}

```markup
<!DOCTYPE html>
<html>
<head>
      <title>Exercício 1</title>
</head>
<body>
      <h1>No Meio do Caminho</h1>
      <p>
        No meio do caminho tinha uma pedra<br>
        tinha uma pedra no meio do caminho<br>
        tinha uma pedra<br>
        no meio do caminho tinha uma pedra<br>
      </p>
      <p>
        Nunca me esquecerei desse acontecimento<br>
        na vida de minhas retinas tão fatigadas<br>
        Nunca me esquecerei que no meio do caminho<br>
        tinha uma pedra<br>
        tinha uma pedra no meio do caminho<br>
        no meio do caminho tinha uma pedra
      </p>
      <p>Carlos Drummond de Andrade</p>
</body>
</html>
```

{% endtab %}
{% endtabs %}

{% tabs %}
{% tab title="Exercício 2" %}
Faça uma página HTML que exiba o seguinte resultado:

![](https://lh4.googleusercontent.com/9BdWfPgLIA2i3G9K0V3RCpCCJ2gaFNRJI35aL0Qw06IvTg0aWu4gJ1LTQ7P8WvEuRHCKVcmuvdJcQmLJ3cIBVZqH_lECWeNPODO8h8vW5kGXJnfUHytbenux3aUfhPLXB-Pk84Gp5L0)
{% endtab %}

{% tab title="Resposta" %}

```markup
<!DOCTYPE html>
<html>
<head>
    <title>Exercício 2</title>
</head>
<body>
    <h1>Lista de Afazeres</h1>
    <ol>
        <li>Segunda-Feira
             <ul>
              <li>Terminar o projeto</li>
              <li>Pular corda</li>
            </ul>
        </li>
        <li>Terça-Feira
          <ul>
              <li>Ir no supermecado</li>
              <li>Dev.leran() S3</li>
            </ul>
        </li>
        <li>Quarta-Feira
          <ul>
              <li>Ir na aula</li>
              <li>Dev.boost() &lt 3</li>
            </ul>
        </li>
    </ol>
</body>
</html>
```

{% endtab %}
{% endtabs %}

{% tabs %}
{% tab title="Exercício 3" %}
Faça uma página HTML que exiba o seguinte resultado:

![](https://lh5.googleusercontent.com/eXT8vSGYp3171vJIcgWZRQ2n5gyapLpxfk76PoWsZRPZHCoBLFuJpD2KaqLJRZBpDrqbz0dy_0CXgdU422ww3-8NsYTGOUe5yzj7LilKS2Sdfm4dXegQ9FjPWHs_gz6iHxP4W5VVIuw)

Obs: pode ser a foto de qualquer cachorro.
{% endtab %}

{% tab title="Resposta" %}

```markup
<!DOCTYPE html>
<html>
<head>
    <title>Exercício 3</title>
</head>
<body>
  <h1>Meu cachorro</h1>
  <img src=".assets/cachorro" alt="um cachorro preto e branco utilizando um laço na cabeça">
  <p>
    Lições do melhor amigo.<br>
    Se um cachorro fosse seu professor você aprenderia habilidades assim:<br>
      - Quando alguém que você ama chegar em casa, corra ao seu encontro;<br>
      - Não morda se um rosnado resolver a situação;<br>
      - Não importa quantas vezes o outro magoar você, volte e faça as pazes.<br>
  </p>
</body>
</html>
```

{% endtab %}
{% endtabs %}
