前情提要

猪包在备考思政时在大佬的推荐下发现notebooklm的闪卡记忆功能很好用，但是每次想用都得进入notebooklm的网页，很慢。遂决定用AI写一个本地启动器，即为本仓库。欢迎使用体验。 如果你也想用这个仓库启动notebooklm的闪卡，只需要从notebooklm下载flashcards.csv再移动到本仓库目录下，再按下面的指示进行即可。 祝备考顺利🥰

闪卡学习系统 - 暗色简洁版

一个现代化、暗色主题的闪卡学习网页应用，专注于高效记忆和学习。

设计特点

🎨 界面设计

• 暗色主题：深色背景减轻视觉疲劳，适合长时间学习
• 竖屏布局：优化移动设备和桌面使用体验
• 简洁优雅：核心功能突出，辅助功能折叠收纳
• 响应式设计：适配手机、平板和桌面设备

🃏 核心功能

• 卡片翻转：点击卡片或按空格键查看答案
• 智能导航：上一张/下一张卡片导航
• 学习进度跟踪：标记已学卡片，圆形进度条显示整体进度
• 多种学习模式：顺序学习、随机打乱、自动翻转

🧠 记忆优化

• 专注式界面，减少干扰
• 大字体清晰展示问题与答案
• 视觉反馈和流畅动画增强记忆效果

快速启动

方法一：使用启动脚本

./start.sh

方法二：使用Python服务器

python3 server.py

方法三：简单HTTP服务器

python3 -m http.server 8080

启动后访问：http://localhost:8080

重要提示：如果直接双击打开index.html文件，某些浏览器可能会限制本地CSV文件加载。建议通过HTTP服务器运行以获得完整功能。如果直接打开时CSV加载失败，应用将自动使用示例数据。

使用说明

基本操作

1. 查看卡片：卡片正面显示问题，点击卡片或按空格键翻转查看答案
2. 导航卡片：
   • 点击"上一张"/"下一张"按钮
   • 使用键盘左右箭头键（← →）
3. 标记进度：
   • 点击✓按钮标记当前卡片为已学习
   • 按 M 键快速标记

辅助功能（折叠收纳）

点击左上角菜单按钮或右上角设置按钮打开侧边面板：

📋 卡片列表

• 查看所有卡片缩略
• 快速跳转到特定卡片
• 识别已学习卡片

⚙️ 学习设置

• 自动翻转：设置自动翻转时间间隔（0-10秒）
• 字体大小：调整卡片文字大小（小/中/大）
• 动画速度：控制翻转和过渡动画速度

📊 学习统计

• 总卡片数
• 已学习卡片数
• 学习进度百分比
• 已加载卡片数

⚡ 快捷操作

• 导出学习进度（JSON格式）
• 导入学习进度
• 查看帮助文档

键盘快捷键

按键	功能
←	上一张卡片
→	下一张卡片
空格	翻转卡片
M	标记/取消标记为已学习
R	随机打乱卡片顺序
Esc	关闭帮助窗口
Ctrl+H	打开/关闭帮助

数据格式

应用从 flashcards.csv 文件加载数据，每行格式为：

问题,答案

示例：

名词解释：思想道德素养,人们的思想观念、政治立场、价值取向、道德情操和行为习惯等方面品质和能力的综合体现。
论述进入新时代的意义的第一点是什么？,意味着中华民族迎来了从站起来、富起来到强起来的伟大飞跃，迎来了实现中华民族伟大复兴的光明前景。

系统会自动检测卡片类型：

• 名词解释：包含"名词解释"、"是什么"、"什么是"、"定义"
• 论述题：包含"论述"、"为什么"、"如何"、"意义"
• 关系题：包含"关系"、"区别"、"联系"、"比较"
• 特点题：包含"原则"、"特征"、"特点"、"性质"

文件结构

FlashCards/
├── index.html          # 主页面（暗色简洁版）
├── style.css           # 暗色主题样式表
├── script.js           # JavaScript逻辑
├── flashcards.csv      # 闪卡数据（73张学习卡片）
├── server.py           # Python HTTP服务器脚本
├── start.sh            # 启动脚本
├── README.md           # 本文档
└── PROJECT_SUMMARY.md  # 项目总结

技术特点

• 纯前端实现：HTML5 + CSS3 + JavaScript
• 本地存储：学习进度自动保存到浏览器
• 响应式设计：CSS媒体查询适配各种屏幕
• 模块化代码：清晰的功能分离和事件处理
• 第三方资源：Font Awesome图标，Google字体

故障排除

常见问题

1. CSV文件无法加载

   • 检查 flashcards.csv 文件是否存在
   • 确认文件格式为"问题,答案"
   • 查看浏览器控制台错误信息

2. 进度未保存

   • 检查浏览器本地存储权限
   • 尝试使用其他浏览器

3. 界面显示异常

   • 清除浏览器缓存
   • 刷新页面重新加载

调试提示

• 按 F12 打开开发者工具
• 查看"控制台"选项卡的错误信息
• 检查"网络"选项卡的文件加载状态

浏览器兼容性

• Chrome 60+
• Firefox 55+
• Safari 11+
• Edge 79+

扩展建议

未来功能

1. 用户账户：云同步学习进度
2. 学习统计：图表可视化学习历史
3. 语音支持：TTS朗读问题和答案
4. 移动应用：PWA支持，离线使用

技术改进

1. 离线缓存：Service Worker支持离线使用
2. 性能优化：Web Workers处理大数据
3. 国际化：多语言界面支持

许可证

本项目代码可自由使用、修改和分发，仅供学习目的。

---

提示：为获得最佳体验，建议使用现代浏览器并保持网络连接以加载外部资源（字体、图标库）。

更新日期：2026年1月3日 版本：暗色简洁版 v1.0