图片资源使用说明
文件夹结构
public/images/
├── logo.png # 网站主logo
├── nav-icons/ # 导航栏图标
│ ├── home.png
│ ├── courses.png
│ └── ...
├── banners/ # 横幅图片
│ ├── hero-banner.jpg
│ └── ...
└── courses/ # 课程相关图片
├── course-1.jpg
├── course-2.jpg
└── ...
使用方法
1. 导航栏Logo
将logo图片命名为 logo.png 并放在 public/images/ 文件夹中，然后在 AppHeader.vue 中取消注释：
<img src="/images/logo.png" alt="Logo" class="logo-image" />
2. 课程图片
将课程图片放在 public/images/courses/ 文件夹中，然后在代码中使用：
<img src="/images/courses/course-1.jpg" alt="课程图片" />
3. 横幅图片
将横幅图片放在 public/images/banners/ 文件夹中：
<img src="/images/banners/hero-banner.jpg" alt="横幅图片" />
注意事项
- 图片文件名建议使用英文和数字，避免中文字符
- 推荐的图片格式：PNG（透明背景）、JPG（照片）、SVG（图标）
- 建议压缩图片以提高加载速度
- Logo建议尺寸：32x32px 或 64x64px
- 课程图片建议尺寸：300x200px
- 横幅图片建议尺寸：1200x400px
图片优化建议
- 使用在线工具压缩图片（如 TinyPNG）
- SVG格式适合简单图标
- WebP格式可以提供更好的压缩率