Finalizando o HTML

Lição 7 de 17 do curso Acordeão de Imagens | Projeto Front-end da Coddy.

Agora, você pode ver que temos um input e um label. E isso, juntos, representa uma única seção do accordion.

Desafio

Fácil

1. Copie as seções de input e label. E abaixo da label, cole-as três vezes:

<input type="radio" name="slide" id="c1" checked>
<label for="c1" class="card" id="one">
    <div class="row">
        <div class="icon">1</div>
        <div class="description">
            <h4>Morning</h4>
            <p>When sun rises</p>
        </div>
    </div>
</label>

2. Como nosso primeiro input tem um ID definido como "c1", certifique-se de alterar os IDs dos próximos inputs para "c2", "c3", e "c4".

3. O mesmo para as labels; altere os IDs das próximas labels definidos como "two", "three", e "four".

Experimente você mesmo

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>