《网页设计与制作》 教学课件 主讲人：湖南铁道职业技术学院陈承欢 HUNAN RAILWAY PROFESSIONAL TECHNOLOGY COLLEGE
Hunan Railway Professional Technology College 主讲人：湖南铁道职业技术学院 陈承欢 《网页设计与制作》 教学课件
教学单元2：网页制作基础 一、课程引导 湖南城道营政外学院 二、 明确知识技能目标 三、展示网页浏览效果 四、分析操作任务 要教学环节 五、知识讲解与操作示范 六、课堂模仿实践 七、疑难解析 八、归纳总结 九、布置习题 网页设计与制作
教学单元2：网页制作基础 主 要 教 学 环 节 五、知识讲解与操作示范 一、课程引导 二、明确知识技能目标 三、展示网页浏览效果 四、分析操作任务 六、课堂模仿实践 七、疑难解析 八、归纳总结 九、布置习题
(一) 课程引导 第1章我们欣赏了多个赏心悦目的网站，重点分析了 这些网站首页的结构布局、颜色搭配、视觉效果等。 线 欣赏完这些网页后，你是否对制作网页产生了兴趣， 定想知道这些网页是如何设计、制作的。 首先让我们学习网页制作的基础知识 蒸 了解网页的相关概念和术语、分析网页中主要的构成 或 元素 认识一些制作网页、处理图像、制作动画的工具。 重点熟悉Dreamweaver8的启动与退出、界面布局和 克 工作环境。 网顷设计与制作
（一）课程引导 第1章我们欣赏了多个赏心悦目的网站，重点分析了 这些网站首页的结构布局、颜色搭配、视觉效果等。 欣赏完这些网页后，你是否对制作网页产生了兴趣， 一定想知道这些网页是如何设计、制作的。 首先让我们学习网页制作的基础知识 了解网页的相关概念和术语、分析网页中主要的构成 元素 认识一些制作网页、处理图像、制作动画的工具。 重点熟悉Dreamweaver 8的启动与退出、界面布局和 工作环境
(二) 明确知识技能目标 湖南绒道 (1)了解网页的相关概念和术语，认识网页中 的主要构成元素 (2)了解一些制作网页、处理图像、制作动画 的专业工具 (3)熟悉Dreamweaver8的启动与退出 紫技御拳院 (4)熟悉Dreamweaver8的界面布局和工作环境 网页设计与制作
（二）明确知识技能目标 （1）了解网页的相关概念和术语，认识网页中 的主要构成元素 （2）了解一些制作网页、处理图像、制作动画 的专业工具 （3）熟悉Dreamweaver 8的启动与退出 （4）熟悉Dreamweaver 8的界面布局和工作环境
(三) 知识讲解 湖南 2.1 网站和网页的基础知识 1.www 道 WWW是“World Wide Web”的首字母缩写，也称 为万维网。 万维网是因特网主要的部分，万维网是基于超文 本结构体系。 残 从技术上讲，WWW包含三个基本组成部分：UL (统一资源定位器)、HTTP(超文本传输协议)、 琴 HTML（超文本标记语言)。 防 网页设计与制作
2.1 网站和网页的基础知识 1．WWW WWW是“World Wide Web”的首字母缩写，也称 为万维网。 万维网是因特网主要的部分，万维网是基于超文 本结构体系。 从技术上讲，WWW包含三个基本组成部分：URL （统一资源定位器）、HTTP（超文本传输协议）、 HTML（超文本标记语言）。 （三）知识讲解
三) 知识讲解 南 2.URL URL是“Uniform Resource Locator”的缩写，通 常翻译为”统一资源定位器 道 它是一个指定Internet.上资源位置的标准，也就 是人们常说的网址。 3.Server与Browser 爽 Server即服务器，Browser即浏览器。 用户必须通过浏览器连接到Wb服务器上，才能阅 读Web服务器上的文件。 克 网页设计与制作
2．URL URL是“Uniform Resource Locator”的缩写，通 常翻译为”统一资源定位器“ 它是一个指定Internet上资源位置的标准，也就 是人们常说的网址。 3．Server与Browser Server即服务器，Browser即浏览器。 用户必须通过浏览器连接到Web服务器上，才能阅 读Web服务器上的文件。 （三）知识讲解
(三) 知识讲解 湖南 4.网页 万维网中的文档又称为网页，网页中可以包含文本、 图像、动画、音频、视频等信息。 道 网页按其表现形式可以分为静态网页和动态网页。 5.网站 网站是网页的集合。通过超级链接将网站中多个网 残 页建立联系，形成一个主题鲜明、风格一致的站点。 6.Hypertext Hypertext（超文本)是一种可以指向其他文件的 文字或图片，这种功能称为超级链接(HyperLink)。 克 网页设计与制作
4．网页 万维网中的文档又称为网页，网页中可以包含文本、 图像、动画、音频、视频等信息。 网页按其表现形式可以分为静态网页和动态网页。 5．网站 网站是网页的集合。通过超级链接将网站中多个网 页建立联系，形成一个主题鲜明、风格一致的站点。 6．Hypertext Hypertext（超文本）是一种可以指向其他文件的 文字或图片，这种功能称为超级链接（HyperLink）。 （三）知识讲解
(三) 知识讲解 湖南 7.HTTP HTTP是一种网络上传输数据的协议，是 “Hypertext Transfer Protocol”的缩写，专门用于 道 传输万维网中的信息资源。 8.HTML 蒙 HTML是“HyperText Markup Language”的缩写， 意为超文本标记语言，是Internet中编写网页的主要标 识语言。 琴 克 网页设计与制作
7．HTTP HTTP是一种网络上传输数据的协议，是 “Hypertext Transfer Protocol”的缩写，专门用于 传输万维网中的信息资源。 8．HTML HTML是“HyperText Markup Language”的缩写， 意为超文本标记语言，是Internet中编写网页的主要标 识语言。 （三）知识讲解
(三) 知识讲解 9. CSS CSS是“Cascading Style Sheet”的缩写，意 线 为层叠样式表 用于对网页布局、，字体、颜色、 背景和其他图 文效菓实现更加精确的控制。 10.JavaScript JavaScript是一种脚本语言，可以和HTML语言 混合在一起使用 爽 用来实现在一个Web页面中与用户交互作用。有 关JavaScript的详细内容将在第13章讲解 网页设计与制作
9．CSS CSS是“Cascading Style Sheet”的缩写，意 为层叠样式表 用于对网页布局、字体、颜色、背景和其他图 文效果实现更加精确的控制。 10．JavaScript JavaScript是一种脚本语言，可以和HTML语言 混合在一起使用 用来实现在一个Web页面中与用户交互作用。有 关JavaScript的详细内容将在第13章讲解 （三）知识讲解
三) 知识讲解 2.2 网页的基本构成元素 线 网页由文本、图像、动画、超链接等基本元素构成。 1.文本 一般网页中最多的内容是文本，可以根据需要对其字 感 体、大小、颜色、底纹、边框等属性进行设置 2.图像 爽 丰富多彩的图像是美化网页必不可少的元素，用于网 页上的图像一般为jpg格式和gif格式，即以jpg和gif为扩 琴 展名的图像文件。 克 网页设计与制作
2.2 网页的基本构成元素 网页由文本、图像、动画、超链接等基本元素构成。 1．文本 一般网页中最多的内容是文本，可以根据需要对其字 体、大小、颜色、底纹、边框等属性进行设置 2．图像 丰富多彩的图像是美化网页必不可少的元素，用于网 页上的图像一般为jpg格式和gif格式，即以jpg和gif为扩 展名的图像文件。 （三）知识讲解