资源简介

(共24张PPT)
分享我的美食
2025.03
七年级（下）信息科技 第一单元 用网页展示美食
同学们，上节课我们借助Typora这个神奇的工具，已经完成了网页的设计，把自己喜爱的美食通过文字、图片等形式，生动地呈现在了页面上。
课堂导入
学习使用 Mkdocs 这个工具，把之前在 Typora 中设计好的 Markdown 文件发布成网页，让全世界的人都有机会品尝到我们分享的 “美食盛宴”。
01
发布作品
发布作品
1.使用Markdown编辑器导出HTML文件，再用浏览器打开查看导出的文件。
发布作品
实践活动：打开导出的HTML网页文件，看显示是否正常；如果不正常可能是什么原因，如何解决？
图片路径问题...
代码格式问题...
浏览器兼容性问题...
导出设置问题...
发布作品
2.发布Markdown文件为网页，有多种工具可用。选择使用Mkdocs，使用步骤，参考本教材“附录二”。
发布作品
环节1：安装
第一步:在电脑上正确安装Python
第二步:管理员模式启动CMD，在CMD下运行“pipinstall mkdocs”即可安装上mkdocs
步骤环节——以 Windows10系统为例
发布作品
第三步:在CMD 下输入“mkdocs new D:\身边的美食”，即可将“D:\身边的美食”文件夹设为程序的运行目录。
发布作品
环节2：文件管理
将自己的所有Markdown 文件，全部拷贝到“D:\身边的美食\docs\”目录之下，如果有图片文件夹，也要拷贝到该目录中。
发布作品
环节3：目录设置
第四步:在CMD 下执行“D:回车”，则进入D盘;在CMD 下运行“cd 身边的美食\”，则进入“D:\身边的美食”目录
第五步:在CMD 下运行mkdocs serve，即从本文件夹中，开启网页服务
发布作品
环节4：网页访问
查看已被自动转为HTML的Markdown 文件在浏览器中输入“http://127.0.0.1:8000/”+“网页名称”，例如：http://127.0.0.1:8000/身边的美食——探究Markdown标记一/
思考活动
对比网页源代码和编辑器源代码，讨论HTML和Markdown的关系。
在网页中鼠标右键，点击“查看页面源代码”
思考活动
对比网页源代码和编辑器源代码，讨论HTML和Markdown的关系。
思考活动
HTML 是用于构建网页的超文本标记语言，通过各种标签来描述内容的语义和呈现方式，对语法要求严格，直接决定网页在浏览器中的渲染效果。
Markdown 是轻量级标记语言，专注于内容创作，利用简单符号进行格式标记，语法宽松、可读性强，需借助解析器转换为 HTML 才能在网页上显示。
Markdown 可通过解析器生成 HTML，二者存在转换关系，在功能上互补，分别适用于网页开发和文档写作等不同场景。
02
分享我的美食
分享作品，以“准确、正面、高效”三个要点为评价指标，同桌之间互评，整理意见并进行合理优化。
分享我的美食
评价指标 同学评价 我的优化方案
准确
正面
高效
分享我的美食
在网上发布信息，必须遵守《中华人民共和国网络安全法》等相关法律，严格遵守网络礼仪和道德规范，用文明语言和理性态度发表网络评论，营造理性、平和、有序的网络舆论环境。
分享我的美食
填写下表，对比导出HTML 网页与用Mkdocs发布网页的区别。
HTML Mkdocs
更改后需要重新导出 即时预览，不用重新导出
...... ......
03
拓展阅读
思维可视化是指运用一系列图示技术把本来不可视的思维呈现出来，使其清晰可见的过程。被可视化的“思维”更有利于理解和记忆，可有效提高信息加工及信息传递的效率。
拓展阅读
圆圈图
气泡图
双气泡图
拓展阅读
树形图
流程图
复流程图
拓展阅读
树形图
桥形图
课堂小结
Typora 导出 HTML：用 Typora 把美食 Markdown 文件转为 HTML，方便本地或小范围分享。
Mkdocs 发布网页：借助 Mkdocs 将 Markdown 文件发布成网页，能自动生成目录，支持多页面管理，适合网络广泛分享。
信息发布要点
准确：食材、做法等描述无误。
完整：涵盖美食起源、特色等。
合法：内容合规，不抄袭。
导出 HTML 文件和 Mkdocs 发布网页的区别
HTML 文件：单个网页，适合简单本地分享，多页面管理不便。
Mkdocs 网页：完整网站，目录、导航清晰，支持版本控制，利于网络公开分享系列内容。
作业布置
实践作业：学期内，小组或个人设计一个小型的信息科技实践作品，以“未来校园、智慧社区”等为主题，如制作一个模型作品、编写一个小程序等。

展开更多......

收起↑