内容正文:
第一单元 用网页展示美食
第二节 记录我的美食
1
1
项目主题
美食之旅
项目背景
能对信息进行编辑、整理、发布、评价,是信息社会公民的基本素质。本项目以“美食介绍”为例,让同学们学会简单的网页编辑、发布技能,提升信息评价能力,并在此过程中感受我国传统美食文化的博大精深。
项目目标
以“美食介绍”为项目载体,掌握简单的Markdown标记语言,能使用 Markdown 撰写“美食介绍”文档,并能使用静态网页生成工具 Mkdocs,将撰写的文档发布为网页。通过完成本项目提升信息编辑、发布、评价等方面的信息素养。
学习过程
·确定要展示的主题
·利用智能搜索引擎,围绕主题收集、整理素材
确定主题
·了解 HTML 和Markdown 各自的优缺点
·选定编辑工具
·掌握常用Markdown标记,并使用标记编写页面
编辑页面
·用 Mkdocs 将编写完毕的页面发布为网页
·同学间交流、互评,根据互评优化页面
交流发布
教学目标:
1、掌握Markdown文件的编辑方法。
2、能使用Markdown标记语言创作作品。
3、理解并使用Markdown标记语言的结构和层次化特点。
4、通过小组合作,学会如何优化文档内容和格式。
5、让学生在实践探索中掌握知识的同时体会中国的传统餐饮文化。
3
问:上节课我们学习了HTML和Markdown的基本概念,谁能说说它们的区别?
答:HTML功能强大但复杂,Markdown简单易用,适合快速编写文档。
复习导入
4
任务一实践活动:确定自己要介绍的美食,想想要展示这道美食的哪些方面,填写气泡图。
自主探索
菜名:
味型:
适宜人群:
主材:
展示美食的不同方面
5
一、Markdown 文件编辑工具——Typora
高效点拨1
Typora以其简洁美观的界面和强大的功能受到广泛好评。它支持多个平台,采用所见即所得的编辑方式,即时预览功能让用户无需切换视图即可编辑。此外,Typora还支持Markdown源代码编辑模式,并能够导出为HTML、PDF、Word等多种格式。
6
1.安装Typora
二、文字材料结构(Markdown基本语法)
高效点拨2
用 Markdown 标记语言生成HTML 页面,首先需要在编辑器中按需求对内容进行编排。
Markdown 基本的语法包括标题、列表、引用、图片、链接、表格、文字修饰等。
插入文本内容
8
任务二(实践活动):根据自己要介绍的美食,将自己收集到的素材添加到Typora编辑器中。
9
任务三(思考活动):
1.如何在编辑器中查看源代码视图?
2.有没有更快捷的方法调整标题级别?
3.页面小标题可否使用无序列表展示?
点拨:
1.查看源代码:菜单栏上选择“视图”→源代码模式
2.用快捷方式快速调整标题级别
3.设置无序列表:菜单栏上选择“段落”→无序列表
可以通过打开文件在编辑器中查看源代码视图来确定该文档编写的痕迹,那我们如何在编辑器中查看源代码视图呢?
上节课讲到了Markdown基本的语法,包括标题、列表、图片、链接、表格、字体等。
我们如何通过肉眼看到别人编写的文档都用了哪些格式呢?就比如说左边这个例子,都运用了哪些格式?
刚刚我们通过查看源代码知道了示例中的标题属于二级标题,那现在我要调整改标题有哪些方法?回想上节课学习的内容,有没有更快捷的办法调整我们的标题级别?
①在源代码视图下,直接增减“#”的数量
②选中标题,使用快捷键:ctrl+数字1到6
合理使用 Markdown标记,能让文档的层次更有条理。
高效点拨3
三、探究标记作用
14
Markdown标记参考
15
(1)菜单栏上选择“段落”→一级标题/二级标题/三级标题/四级标题/五级标题/六级标题
(2)使用Markdown标记
1.设置标题级别
(1)菜单栏上选择“段落”→有序列表/无序列表
(2)使用Markdown标记
2.设置列表
(1)菜单栏上选择“格式”→图像→插入图片/插入本地图片
(2)使用Markdown标记
免费图床网址:https://freeimage.host/(可直接复制图片地址dillinger编辑器中)
3.插入图片
(1)菜单栏上选择“格式”→超链接
(2)使用Markdown标记
4.插入超链接
(1)菜单栏上选择“段落”→表格→插入表格
(2)使用Markdown标记
5.插入表格
(1)菜单栏上选择“段落”→代码块
(2)使用Markdown标记
6.代码块
(1)菜单栏上选择“格式”→加粗/斜体/下划线
(2)使用Markdown标记
7.文本效果
任务四(探究活动):观察下面示例,说出其中运用了Markdown哪些标记,并根据示例完善自己要介绍的美食作品。
标题
文本效果
列表
图片
表格
……
24
在编辑 Markdown 文档时,可以选择不同主题来呈现不同的显示效果。不同风格的主题由不同的CSS文件决定,这些CSS文件可通过网络下载。
高效点拨4
四、作品成稿
1、不同主题的展示
25
2、不同的CSS文件
在编辑 Markdown 文档时,可以选择不同主题来呈现不同的显示效果。不同风格的主题由不同的CSS文件决定,这些CSS文件可通过网络下载。
任务五:参考本教材“附录一”,编辑你准备的素材,形成最终的美食介绍文稿。
27
展示完毕 感谢您的聆听
28
Lavf59.14.100
$$