HTML5&CSS3 教案及教学设计合并.docx

下载文档

8
0
约6.2万字
约 197页
2022-11-08 发布于湖北
举报
版权申诉
保障服务

HTML5&CSS3 教案及教学设计合并.docx

1、本文档共197页，可阅读全部内容。
2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击这里二次下载。
4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。

课程教案课题名称第 1 章网站开发入门第 1-3 节网站开发相关知识、HTML与CSS基础语法、网页基本结构授课班级授课学时 2 授课地点授课形式讲授、演示参考教材《前端HTML+CSS修炼之道》教学资源电子课件、教案、文字材料教学目标知识目标：了解网站开发的基本流程和相关知识；了解HBuilder工作环境及使用方法，能够建立站点及新建网页；了解HTML&CSS在网页制作中的作用，了解Web标准的概念，能够使用HTML标签创建简单的网页；技能目标：网站开发的基本流程和相关知识； HBuilder工作环境；Web标准的概念素质目标：培养学生认真、一丝不苟的学习态度教学重点与难点教学重点 HTML与CSS基础语法、网页的基本结构教学难点网页的基本结构学情分析本次所讲内容选自教材第1章第1-3节。因为本次课程是学习网站制作的基础，学生必须掌握软件的使用，掌握站点的建立及网页的创建。教学过程课前：预习课中：网站基础知识创建HBuilder站点制作简单的HTML+CSS页面课后：启动HBuilder，熟悉其工作界面；创建“阳光旅游”网站，并创建一个网页文件“index.html”和图像子文件夹“img” 教学反思采用启发式教学，通过多媒体课件现场演示更加生动，与学生互动效果更好；在上机课上学生学会了如何创建站点和简单的网页页面；课后布置了有关站点的作业，并且利用上机时间完成和指导工作课程网站开发软件及基础语法教学设计课程名称 HTML5&CSS3 授课对象 2021级计算机应用技术专业1-4班授课章节第 1 章网站开发入门第 1-3 节网站开发相关知识、HTML与CSS基础语法、网页基本结构本次课学时数 2学时教学目的 1.了解网站开发的基本流程和相关知识； 2.了解HBuilder工作环境及使用方法，能够建立站点及新建网页； 3.了解HTML&CSS在网页制作中的作用，了解Web标准的概念，能够使用HTML标签创建简单的网页；教学分析本次所讲内容选自教材第1章第1-3节。因为本次课程是学习网站制作的基础，学生必须掌握软件的使用，掌握站点的建立及网页的创建。教学重点与难点重点 HTML与CSS基础语法、网页的基本结构难点网页的基本结构教学方法与手段 ●课堂讲授 ●讲解例题 ●电子课件 ●案例分析 ○小组讨论 ●文字材料 ●提问 ○音像材料其他：代码演示教学过程设计教学内容教学过程设计意图时间分配课程导入网站是一种新型的信息传播工具，人们通过它来发布自己想要公开的资讯及提供相关的网络服务，许多公司都要自己的网站，用于宣传公司或发布产品信息等，那么大家可以思考下如何开发一个网站，即开发的流程引入本章所学内容 5分钟了解网站开发流程（1）网站基础知识网页就是我们上网时在浏览器中打开的一个个画面；网站就是一组相关网页的集合；主页就是打开某个网站时显示的第一个网页，又叫首页；（2）Internet,IP地址和域名 Internet的全称是Internetwork，中文称为因特网；因特网上连接了不计其数的服务器和客户机，每一个主机在因特网上都有一个唯一的地址，我们称这个地址为IP地址；一种与IP地址对应的字符来表示地址，这就是域名；（3）WWW,HTTP,URL和浏览器 WWW是World Wide Web的缩写，中文称为“万维网”，也可简称为Web； HTTP：超文本传送协议，它负责规定浏览器和服务器怎样互相交流； URL：统一资源标识符，也称为网址；浏览器：是WWW服务的客户端浏览程序；让学生理解网站开发流程 20分钟创建站点步骤1：选择菜单栏中的“站点”>“新建站点”菜单；步骤2：在“站点名称”文本框中输入站点名称，在“本地站点文件夹”输入步骤1中文件夹的物理地址；步骤3：单击“保存”。让学生掌握如何创建站点 20分钟制作简单的HTML+CSS页面以案例讲解网页基本结构（1）HTML标签概述 HTML标签是由尖括号括起来的关键词，绝大多数HTML标签都是成对出现的，包含标记头<>和标记尾< / >。标记头是开始标签，标记尾是结束标签，中间是元素内容，如段落标签<p></p>。除双标签外也存在少量的单标签，如换行标签<br/>。（2）HTML标签格式格式1：<标签名>标签内容（文本或超文本）<／标签名> 格式2：<标签名属性名1＝"属性值1" 属性名2＝"属性值2">标签内容（文本或超文本）</标签名> 格式3：<标签名/> （3）网页基本结构 <html> <head> <title></title> <meta/> <style></style>