AI Skill MartKhám phá skillLệnhChương trìnhHọcSkill là gì?
 
← Về danh sách

Tạo kiểu cho bản trình chiếu

Tài liệu tham chiếu các class CSS và mẫu HTML dùng cho bộ slide HTML một tệp.

Thiết kế · UITrung cấp★ 68,873⑂ 6,858Điểm AI 6/10Cập nhật lần cuối: 9 thg 11, 2026

Làm được gì

  • Liệt kê theo nhóm các class CSS dùng trong presentation/index.html: bố cục, khối nội dung, danh sách, tag/badge.
  • Cung cấp quy ước tô màu cú pháp trong .code-block bằng các <span>: .comment, .key, .string, .cmd.
  • Đưa sẵn mẫu HTML cho các loại slide hay dùng: so sánh hai cột Before/After, slide có ví dụ code, danh sách có icon.
  • Nêu quy tắc quan trọng: không hardcode weight-badge vì JavaScript tự chèn/xóa.

Phù hợp với ai

  • Người bảo trì hoặc thêm slide cho bộ trình chiếu HTML trong repo này.
  • Người muốn Claude Code sinh HTML slide theo đúng quy ước đặt tên class.
  • Người đang tự xây một slide deck HTML một tệp và cần mẫu tham khảo.

Ví dụ sử dụng

  1. "Thêm slide so sánh Vibe Coding và Agentic" → tạo .two-col với .col-card bad và .col-card good.
  2. "Làm slide minh họa ví dụ cấu hình" → dùng .trigger-box cho khái niệm chính và .code-block với span màu.
  3. "Chèn danh sách use case kèm icon" → dùng mẫu .use-cases / .use-case-item.

· · · Hướng dẫn cài đặt · · ·

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/shanraisshan/claude-code-best-practice/HEAD/.claude/skills/presentation/presentation-styling/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên AI Skill Mart.
Copy thư mục .claude/skills/presentation/presentation-styling từ repo GitHub shanraisshan/claude-code-best-practice vào ~/.claude/skills/presentation-styling/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/shanraisshan/claude-code-best-practice.git && mkdir -p ~/.claude/skills/presentation-styling && cp -r claude-code-best-practice/.claude/skills/presentation/presentation-styling/* ~/.claude/skills/presentation-styling/

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Mở Terminal.
  2. Tải repo: git clone https://github.com/shanraisshan/claude-code-best-practice.git
  3. Tạo thư mục kỹ năng: mkdir -p ~/.claude/skills/presentation-styling
  4. Sao chép tệp: cp -r claude-code-best-practice/.claude/skills/presentation/presentation-styling/* ~/.claude/skills/presentation-styling/
  5. Khởi động lại Claude Code và kiểm tra bằng /skills.
  6. Khi làm việc, hãy mở kèm presentation/index.html của repo rồi yêu cầu kiểu "thêm một slide mới".
Xem mã nguồn trên GitHub ↗Giấy phép: MIT