数学答题技巧 (Math Answering Skills)

一个简洁、快速的 Web 应用，用于组织和展示数学学习笔记、解题技巧和计算器用法。本项目使用 Python Flask 作为后端，通过读取一个简单的 JSON 文件动态生成可交互的目录和内容页面。

🌐 在线浏览

你可以直接访问已部署的网站进行在线浏览：

点我浏览

✨ 主要特性

• 动态内容管理: 所有书籍和章节信息都存储在 config.json 中，增删改查非常方便。
• 自动化目录: 首页目录根据 config.json 自动生成，并按“必修优先、章节升序”的规则排序。
• 一键格式化: 提供 format.py 脚本，可以一键原地排序 config.json，保持数据整洁有序。
• 精美的数学公式: 集成了 KaTeX，可以优雅地渲染 LaTeX 数学公式。
• 响应式设计: 无论是桌面电脑还是手机，都能获得良好的浏览体验。
• 模块化样式: styles.css 负责主布局，content-styles.css 负责正文内容样式，分工明确，易于定制。

🛠️ 技术栈

• 后端: Python 3, Flask
• 前端: HTML5, CSS3, Jinja2
• 数学公式渲染: KaTeX
• 依赖管理: uv

✍️ 如何编写内容

为网站添加新章节或修改内容非常简单，遵循以下“三步曲”即可。

第 1 步：编辑 config.json

这是所有内容的“总指挥部”。

• book_config: 定义书籍的“代号”和“显示名称”的映射。
  • 键（如 "b1", "x1"）是书籍的唯一标识符。
  • 值（如 "必修1", "选修1"）是网站上显示的名称。
• entries: 这是一个列表，每一项代表一个章节。每一项的格式都是一个包含三个元素的列表：[书籍代号, 章节号, 知识点]。
  • 书籍代号: 必须是 book_config 中已定义的键。
  • 章节号: 建议使用 主章.知识点编号 的格式（如 "3.4", "3.10"）。format.py 会正确处理数字排序（3.2 < 3.10）。
  • 章节名称: 将会显示在目录中的标题。

示例：

{
  "book_config": {
    "b1": "必修1",
    "b2": "必修2",
    "x1": "选修1"
  },
  "entries": [
    ["b1", "1.1", "集合"],
    ["x1", "3.1", "求距离"],
    ["b2", "6.1", "解三角形"]
  ]
}

第 2 步：运行 format.py (重要！)

每次修改完 config.json 后，务必运行格式化脚本。

python format.py

这个脚本会做两件事：

1. 排序书籍: 确保 book_config 中“必修”在前，“选修”在后。
2. 排序章节: 确保 entries 列表严格按照“先按书籍、再按章节号”的顺序排列。

为什么这一步很重要？ 网站的目录顺序完全依赖于 entries 列表的顺序。运行此脚本可以保证无论你以何种顺序添加内容，网站的显示都是一致且正确的。

第 3 步：创建和编辑内容文件 (.html)

当你第一次运行网站时，main.py 会自动为你创建缺失的章节模板文件。

• 文件命名: 模板文件遵循 templates/{书籍代号}_{章节号}.html 的格式，其中章节号中的 . 会被替换为 _。例如，["x1", "3.4", ...] 对应的文件是 templates/x1_3_4.html。
• 编写内容: 打开自动生成的 HTML 文件，在 {% block content %} 和 {% endblock %} 之间编写你的正文内容。你可以使用标准的 HTML 标签。
• 编写公式: 使用 KaTeX 的语法来书写数学公式：
  • 行内公式: 使用 \( ... \)，例如 爱因斯坦的质能方程是 \( E=mc^2 \)。
  • 块级公式 (居中显示): 使用 \[ ... \]，例如 \[ \int_a^b f(x)dx = F(b) - F(a) \]。

⚠️ 编写注意事项

1. 先改 config，再跑 format: 这是标准工作流，请务必遵守。

2. 图片资源: 如果文章中需要插入图片，请将图片文件放在 static/images/ 目录下。在 HTML 中使用 url_for 函数来引用它，以确保路径正确：

   <img src="{{ url_for('static', filename='images/your-image.jpg') }}">

3. CSS 自定义:

   • 修改网站整体布局、颜色、字体，请编辑 static/styles.css。
   • 为正文内容（如提示框、代码块、标题等）添加或修改样式，请编辑 static/content-styles.css。

📜 License

本项目采用 知识共享署名-非商业性使用 4.0 国际许可协议 (CC BY-NC 4.0) 授权。

您可以自由使用、分享和修改本项目，但禁止任何形式的商业用途，包括收费售卖、打包发布或盈利性服务。

© 2025 Leowly 保留部分权利。