Khóa học Lập trình miễn phí

Flexbox Photo Gallery

Lập trình

Mô tả: Tạo gallery ảnh responsive với Flexbox

Hướng dẫn

Lời giải

Tạo gallery ảnh với các tính năng: - Layout linh hoạt với flex-wrap - Ảnh tự động co giãn - Hiệu ứng hover - Responsive cho mobile

Code mẫu

<!DOCTYPE html>
<html>
<head>
  <style>
    .gallery {
      /* Viết CSS của bạn ở đây */
    }
  </style>
</head>
<body>
  <div class="gallery">
    <div class="photo-item">
      <img src="https://via.placeholder.com/400x300" alt="Photo 1">
    </div>
    <!-- Thêm nhiều ảnh khác -->
  </div>
</body>
</html>

Thông tin bài tập

Khóa học: HTML & CSS Nâng cao

Bài học: Flexbox Layout

Loại bài tập: Lập trình

Độ khó: Trung cấp

Thời lượng: 65 phút