Ghép HTML, ảnh và video cho các trang

```html <div class="row"> <div class="block_2"><img src="assets/thethao.svg" alt="Minh họa bóng và đường chạy do BTVN dựng" width="480" height="300"></div> <div class="block_2"><h2>Nhóm Thể thao</h2><p>Nhóm mẫu cùng vận động và trao đổi cách phối hợp.</p><p><a href="thethao.html">Xem phần Thể thao</a></p></div> </div> <div class="row"> <div class="block_2"><h2>Nhóm Nghệ thuật</h2><p>Nhóm mẫu thử vẽ, phối màu và giới thiệu ý tưởng của mình.</p><p><a href="nghethuat.html">Xem phần Nghệ thuật</a></p></div> <div class="block_2"><img src="assets/nghethuat.svg" alt="Minh họa bảng màu và nét vẽ do BTVN dựng" width="480" height="300"></div> </div> ``` Tạo HTML hoàn chỉnh như các bài trước: DOCTYPE, html, head với meta charset UTF-8, title và link CSS; body chứa đầu trang, nội dung chính rồi cuối trang. Phần trên là nội dung chính, đặt trong div.content. Mỗi .row ở đây chứa hai .block_2. Hàng đầu đặt ảnh trước phần giới thiệu Thể thao; hàng sau đặt giới thiệu Nghệ thuật trước ảnh. Không đổi tên class tùy ý khi CSS đã dùng tên ấy. Tạo thethao.html và nghethuat.html theo cùng khung lớn, đổi title và nội dung chính cho đúng từng nhóm. Giữ điều hướng, slogan và cuối trang để cách sử dụng thống nhất.

```html <div class="slogan"> <div class="row"> <div class="block_3"><h2>Kết nối</h2><p>Cùng tham gia một hoạt động.</p></div> <div class="block_3"><h2>Khám phá</h2><p>Thử một điều mới theo sở thích.</p></div> <div class="block_3"><h2>Cùng làm</h2><p>Chia sẻ việc nhỏ trong nhóm.</p></div> </div> </div> ``` Các div.block_3 là con của một div.row nằm trong div.slogan. Quan hệ này giúp CSS xếp ba ô theo hàng ở màn hình rộng. Chỉ khai báo một class tên row chưa tự xếp ngang nếu tệp CSS chưa được liên kết hoặc thiếu display:flex.

```html <video controls preload="metadata" width="320" height="180"> <source src="assets/minh_hoa.mp4" type="video/mp4"> Trình duyệt chưa phát được video. </video> ``` Video minh_hoa.mp4 trong mẫu là đoạn đồ họa ngắn, không có âm thanh, do BTVN dựng. Mở nghethuat.html, dùng nút phát để kiểm thời lượng, chuyển động và việc phát tới cuối. controls cho phép điều khiển; không cần tự phát để trang có video. Ảnh SVG có alt mô tả nội dung; CSS max-width:100% và height:auto giúp ảnh, video giữ tỉ lệ trong ô. Nếu mất một media, kiểm riêng tên tệp, đuôi và đường dẫn của nó; không mặc định CSS sai toàn bộ.