动手：做一个产品落地页

你要做什么

一个典型的产品落地页：大标题+描述+按钮+特性卡片+页脚。适合展示你的项目、课程或产品。

⏱️ 预计耗时：25 分钟 | 🛠️ HTML + CSS

第一步：生成基础结构

帮我做一个产品落地页：
1. 顶部导航：左侧 Logo，右侧"特性""价格""关于"三个链接
2. Hero 区域：大标题"用 AI 创造你的第一个产品"，副标题描述，两个按钮"免费开始""了解更多"
3. 3 列特性卡片：图标 + 标题 + 描述
4. 底部 Footer：版权信息
5. 配色：白色背景，紫色系按钮和强调色，现代简洁风
使用 HTML + CSS，响应式设计

第二步：添加信任元素

在 Hero 下加一行"已经帮助 1000+ 学习者开始 AI 编程"，用小字显示
在特性卡片下加一段用户评价，左对齐，有引号装饰

第三步：优化转化

把"免费开始"按钮改成渐变色，加 hover 发光效果
Hero 区的背景加上淡紫色渐变
整个页面加平滑的滚动动画

🎯 进阶挑战

• 加上一个 FAQ 折叠区域
• 顶部导航加上 sticky 效果
• 做一个 Newsletter 订阅输入框

✅ 你做到了

• 一个可以上线的产品落地页
• 理解了 CTA、特性展示等产品设计模式
• 学会了渐变、动画等 CSS 进阶技巧