Ví dụ nhúng đa phương tiện trong bài học

Bài học này minh họa cách nhúng nhiều loại phương tiện khác nhau trong cùng một bài học markdown.

1. Hình ảnh và Chú thích (Images & Captions)

Hệ thống hỗ trợ hiển thị hình ảnh với chú thích (caption) tự động được căn giữa ngay bên dưới ảnh.

Cú pháp: ![Nội dung chú thích](url)

Ví dụ:

markdown
1![Vibe Coding Workspace Không gian làm việc lý tưởng cho Vibe Coder](https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=1200&q=80)

Kết quả hiển thị:

Vibe Coding Workspace Không gian làm việc lý tưởng cho Vibe Coder

2. Nhúng Video YouTube

Bạn có thể nhúng video YouTube trực tiếp trong bài học bằng cách sử dụng thẻ HTML iframe:

3. Nhúng tài liệu PDF

Bạn có thể nhúng tài liệu PDF bằng cách sử dụng Google Docs Viewer:

4. Nhúng GitHub Gist

Bạn có thể nhúng GitHub Gist để hiển thị mã nguồn:

5. Kết hợp với nội dung Markdown thông thường

Bạn vẫn có thể sử dụng tất cả các tính năng Markdown thông thường như:

Danh sách

• Mục 1
• Mục 2
• Mục 3

Bảng

Mã nguồn

python
1def hello_world():
2    print("Xin chào thế giới!")
3
4hello_world()

Nút bấm

Tải xuống tài liệu PDF Xem thêm ví dụ

Hướng dẫn sử dụng

Để nhúng các phương tiện vào bài học của bạn:

1. Đặt format: markdown trong frontmatter của bài học
2. Sử dụng các thẻ HTML để nhúng nội dung đa phương tiện
3. Đảm bảo sử dụng các class CSS phù hợp để hiển thị đẹp mắt

Bạn có thể kết hợp nhiều loại phương tiện khác nhau trong cùng một bài học để tạo trải nghiệm học tập phong phú.