# 乔布斯风格PPT网页生成技能
## 🌟 技能特点
- 纯黑背景，极简大气
- 16:9固定比例，完美适配投影和各种设备
- 大字体+高对比度，重点突出
- 渐变彩色标题+动态效果，视觉冲击力强
- 流畅的横向翻页动画，操作便捷
- 全自动生成，无需手动排版
## 🎨 设计规范
### 1. 整体布局
- 背景：纯黑色 #000000，搭配微弱彩色光晕效果
- 比例：严格16:9，内容区域最大宽度1200px，居中显示
- 边距：左右6vw，上下保持居中
### 2. 文字样式
#### 封面大标题
- 字号：clamp(54px, 8.8vw, 132px)
- 颜色：纯白色，带白→红呼吸灯效果
- 特效：text-shadow发光，animation动画呼吸
- 对齐：居中
#### 页面大标题
- 字号：clamp(40px, 6.5vw, 106px)
- 颜色：纯白色，带白→红呼吸灯效果
- 对齐：居中
#### 章节标题
- 字号：clamp(36px, 5vw, 80px)
- 颜色：五彩渐变（红→青→蓝→绿→黄），流动动画
- 对齐：居中
#### 引用文字（名言/原文）
- 字号：clamp(27px, 3.2vw, 44px)
- 颜色：粉紫橙黄五彩渐变，呼吸动画
- 对齐：居中
#### 正文内容
- 字号：clamp(20px, 2.3vw, 32px)
- 颜色：纯白色
- 排版：首行缩进2em，行高1.8
#### 列表内容
- 字号：clamp(24px, 2.8vw, 40px)
- 颜色：纯白色
- 样式：前面带▸绿色符号
### 3. 卡片样式
- 背景：rgba(18, 18, 18, 0.9) 半透明黑色
- 边框：1px solid rgba(255, 255, 255, 0.15) 白色半透明边框
- 圆角：32px
- 效果：backdrop-filter毛玻璃，内阴影发光
- 内边距：clamp(24px, 3vw, 48px)
### 4. 交互控制
- 导航按钮：右下角两个36×36px的圆形按钮，半透明背景，左右箭头
- 进度条：底部4px高彩色渐变进度条，实时显示进度
- 操作方式：
- 点击左右按钮切换
- 键盘左右/上下方向键切换
- 鼠标滚轮切换
- 触摸屏左右/上下滑动切换
### 5. 动画效果
- 页面切换：0.6s平滑translateX动画
- 标题渐变：4s循环流动效果
- 呼吸灯：3s白→红交替发光
- 按钮hover：缩放+变色效果
## 🔧 生成方法
### 基础HTML结构
```html
[PPT标题]
```
### 批量生成步骤
1. 准备PPT内容：按页面整理标题、引用、正文等内容
2. 复制基础HTML模板
3. 替换每个slide中的内容
4. 确保总页数匹配，封面、目录、内容、结束页结构完整
5. 保存为HTML文件即可直接打开使用
## 📱 适配说明
- 自动响应式，支持PC、平板、手机
- 所有字号使用clamp动态适配
- 触摸操作友好，支持滑动翻页
- 支持导出PDF打印
## 🎯 适用场景
- 产品发布会PPT
- 书籍内容展示
- 演讲演示
- 教学课件
- 报告展示
## 🔗 示例链接
http://122.51.24.244/education-16-9-jobs-ppt.html
## 📝 调用方法
触发关键词："生成乔布斯风格PPT"、"制作书籍PPT"、"乔布斯风格演示"
输入参数：PPT标题、内容列表（可接受纯文本、Markdown、Word等格式）
输出：完整的HTML文件+在线访问链接