Hoàn thành HTML

Bài học 7 trên 17 trong khóa học Accordion hình ảnh | Dự án front-end của Coddy.

Bây giờ, bạn có thể thấy chúng ta có một ô đầu vào và một nhãn. Hai phần này kết hợp lại tạo thành một mục trong đàn xếp.

Thử thách

Dễ

1. Sao chép các phần input và label. Dán thêm ba lần bên dưới label:

<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. Vì input đầu tiên có ID là c1, hãy đổi ID của các input tiếp theo thành c2, c3, và c4.

3. Làm tương tự với các label: đổi ID của các label tiếp theo thành two, three, và four.

Tự làm thử

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Viết code HTML ở đây -->
        <script src="script.js"></script>
    </body>
</html>