电子教案《Dreamweaver网页设计与制作第二版》A063954示例项目一.docxVIP

电子教课设计《Dreamweaver网页设计与制作第二版》A063954示例项目一 电子教课设计《Dreamweaver网页设计与制作第二版》A063954示例项目一 电子教课设计《Dreamweaver网页设计与制作第二版》A063954示例项目一 讲课内容 讲课班级 教课方法 与手段 项目内容 教课目的 教课要点 与难点 教课过程 设计  课程教课设计（项目一） 个人网页的简单美化——网页制作基础知识 讲课学时 6 课时 讲解法、演示法、议论法。多媒体教课 本项目的主要工作内容是对一个简单个人网站首页的网页标题、背景颜色、字体大小等基本因素做简单改正，要求在熟习网站的基本知识、认识网页的基本元素基础上，利用 HTML语言达成。 学生经过本项目的学习，能： 1、 认识网页和网站 2、 掌握 IP 地点、网址等基本观点 3、 理解静态网页与动向网页的差别 4、 掌握简单 HTML文件的编写方法 教课要点： 1．什么是网页？ 1）网页内容构成； 2）网页编写语言种类及特色。 2． Dreamweaver CS3 功能简介。 教课难点： 创立 HTML文档，掌握简单 HTML文件的编写方法。 【任务一】认识网站与网页（ 2 课时） （一）网页的观点 网页：是构成 WWW（World Wide Web ：万维网）的基本元素，也被称为页 面或 Web页。不一样的网页经过超链接联系在一同，构成了 WWW纵横交叉构造。 网站：就是一个互相链接的网页的会合，它们能够共享。大的网站页面数目多达几十万，甚至上百万页，小的个人网站也能够只包含数个页面。 主页：是网站中的一个特别网页，它是在 WWW长进入网站的第一个网页，此中包含指向其余网页的超链接，往常主页的名称是固定的。 （二）网页中的常有元素 文本 图像： JPG、 PNG、 GIF 超链接 表单 表格 动画 ( 三 )IP 地点、域名和网址 IP 地点：由 4 个小于 256 的数字构成，数字之间用点间隔 域名：唯一无二，比如： 网址：又称 URL，由通讯协议名称、域名或  IP  地点、网页在服务器中的路 径和文件名 4 部分构成。 （四）动向网页与静态网页 动向网页（ DHTML）：后缀名为 .asp 、.jsp 、 .php 、 .cgi 等静态网页（ HTML）：后缀名 .htm 、 .html 、 .xml 等 （五）任求实行：制作个人网站 【任务二】使用 HTML语言改正简单网页（ 4 课时） 小贴士：什么是 HTML语言 HTML（ Hypertext Markup Language，超文本标记语言） 不是一种编程语言， 而是一种描绘性的标记语言，用于描绘超文本中内容的显示方式。其最基本的 语法就是： 标记 内容 / 标记 。标记往常都是成对使用的， 一个开头标记就对 应有一个结束标记。结束标记不过在开头标记的前面加一个斜杠“ / ”。当阅读 器从服务器接收到 HTML 文件后，就会解说里面的标记符，而后把标记符相对 应的功能表达出来。 （一）创立 HTML文件 1）选择“开始” ，而后挨次选择“程序”→“附件”→“记事本”命令。 2）在翻开的记事本窗口中写入代码： html head titletest/title /head body b 互联网，我来了 ! /b /body /html 3）保留该文档。 4）双击该 HTML文件，会自动翻开阅读器，显示文件内容。 （二） HTML文件构造 html 标记 html 标记放在 HTML文件的开头， 并无实质性的功能， 不过一个形式上的标记， 但要形成一个优秀的编写习惯， 在 HTML文件开头使用 html 标记来做一个形式上的开始。 2. head 标记 head也称为头标记，一般放在 html 标记里，其作用是搁置对于此 HTML 文件的信息，如供给索引、定义 CSS 款式等。 3. title 标记 title 称为标题标记，包含在 head标记内，它的作用是设定网页标题， 能够看见在阅读器左上方的标题栏中显示这个标题，别的，在 Windows 任务栏 中显示的也是这个标题。 4. body 标记 body 又称为主体标记，网页所要显示的内容都放在这个标记内，它是 HTML文件的要点所在。它其实不不过是一个形式上的标记，它自己也能够控制网 页的背景颜色或背景图像。 （三）简单的 HTML事例 设置标题 设置文字颜色 设置加粗、倾斜及文字颜色 4、插入图片 5、说明标记 （四）任求实行：对个人网站首页做简单改正 【知识拓展】网页美化知识 （一）、网页颜色的选择与搭配 设计网页时，可依据以下原则确立网页的背风景和主色彩，并进行颜色搭 配。 1）网页背景颜色最好选择白色或黑色。 2）可依据网站的性质或网站标记