网页设计与制作 第13章 网页按钮和导航制作

《网页设计与制作》教案第一章：网页设计基础1.1 教学目标让学生了解网页设计的基本概念和原则让学生掌握网页设计的流程和方法1.2 教学内容网页设计的概念和定义网页设计的原则和要素网页设计的流程和方法1.3 教学方法讲授法：讲解网页设计的概念和原则实践法：学生动手实践设计简单的网页1.4 教学评价学生能回答出网页设计的概念和定义学生能理解并运用网页设计的原则和要素学生能独立完成简单的网页设计第二章：HTML与CSS基础2.1 教学目标让学生了解HTML和CSS的基本概念和作用让学生掌握HTML和CSS的基本语法和用法2.2 教学内容HTML的基本概念和语法CSS的基本概念和语法HTML和CSS的综合应用2.3 教学方法讲授法：讲解HTML和CSS的基本概念和语法实践法：学生动手实践编写HTML和CSS代码2.4 教学评价学生能回答出HTML和CSS的基本概念和作用学生能理解并运用HTML和CSS的基本语法和用法学生能独立完成简单的HTML和CSS代码编写第三章：网页布局与排版3.1 教学目标让学生了解网页布局和排版的基本原则和方法让学生掌握使用HTML和CSS进行网页布局和排版的技术3.2 教学内容网页布局的基本原则和方法网页排版的基本原则和方法使用HTML和CSS进行网页布局和排版的技术3.3 教学方法讲授法：讲解网页布局和排版的基本原则和方法实践法：学生动手实践进行网页布局和排版3.4 教学评价学生能回答出网页布局和排版的基本原则和方法学生能理解并运用HTML和CSS进行网页布局和排版的技术学生能独立完成具有良好布局和排版的网页设计第四章：网页动画与交互4.1 教学目标让学生了解网页动画和交互的基本概念和原理让学生掌握使用HTML和CSS实现网页动画和交互的技术4.2 教学内容网页动画的基本概念和原理网页交互的基本概念和原理使用HTML和CSS实现网页动画和交互的技术4.3 教学方法讲授法：讲解网页动画和交互的基本概念和原理实践法：学生动手实践实现网页动画和交互4.4 教学评价学生能回答出网页动画和交互的基本概念和原理学生能理解并运用HTML和CSS实现网页动画和交互的技术学生能独立完成具有动画和交互功能的网页设计第五章：网页优化与推广5.1 教学目标让学生了解网页优化和推广的基本概念和方法让学生掌握使用SEO和网络营销技术进行网页优化和推广的技巧5.2 教学内容网页优化的基本概念和方法网页推广的基本概念和方法使用SEO和网络营销技术进行网页优化和推广的技巧5.3 教学方法讲授法：讲解网页优化和推广的基本概念和方法实践法：学生动手实践进行网页优化和推广5.4 教学评价学生能回答出网页优化和推广的基本概念和方法学生能理解并运用SEO和网络营销技术进行网页优化和推广的技巧学生能独立完成具有优化和推广功能的网页设计第六章：网页图像处理与多媒体应用6.1 教学目标让学生了解网页图像处理的基本概念和工具让学生掌握网页图像处理和多媒体应用的技术6.2 教学内容网页图像处理的基本概念和工具（如Photoshop、Fireworks等）多媒体元素在网页中的应用（如音频、视频等）图像和多媒体的HTML和CSS标记6.3 教学方法讲授法：讲解网页图像处理的基本概念和工具实践法：学生动手实践进行网页图像处理和多媒体应用6.4 教学评价学生能回答出网页图像处理的基本概念和工具学生能理解并运用网页图像处理和多媒体应用的技术学生能独立完成具有图像和多媒体应用的网页设计第七章：网页编程技术7.1 教学目标让学生了解网页编程的基本概念和语言让学生掌握常用的网页编程技术和框架7.2 教学内容网页编程的基本概念和语言（如JavaScript、jQuery等）常用的网页编程技术和框架（如Bootstrap、React等）编程实践和项目案例7.3 教学方法讲授法：讲解网页编程的基本概念和语言实践法：学生动手实践进行网页编程和技术应用7.4 教学评价学生能回答出网页编程的基本概念和语言学生能理解并运用常用的网页编程技术和框架学生能独立完成编程实践和项目案例第八章：移动网页设计与制作8.1 教学目标让学生了解移动网页设计的基本概念和原则让学生掌握移动网页设计与制作的技术和工具8.2 教学内容移动网页设计的基本概念和原则移动网页设计与制作的技术和工具（如Responsive Design、Adobe Edge Mobile等）移动网页设计的实践和案例分析8.3 教学方法讲授法：讲解移动网页设计的基本概念和原则实践法：学生动手实践进行移动网页设计与制作8.4 教学评价学生能回答出移动网页设计的基本概念和原则学生能理解并运用移动网页设计与制作的技术和工具学生能独立完成移动网页设计与制作的项目案例第九章：网页项目实战与团队协作9.1 教学目标让学生了解网页项目实战的基本流程和方法让学生掌握团队协作的基本技巧和工具9.2 教学内容网页项目实战的基本流程和方法团队协作的基本技巧和工具（如Git、Project Management Software等）项目案例分析和实战演练9.3 教学方法讲授法：讲解网页项目实战的基本流程和方法实践法：学生分组进行项目实战和团队协作9.4 教学评价学生能回答出网页项目实战的基本流程和方法学生能理解并运用团队协作的基本技巧和工具学生能独立完成项目实战和团队协作的任务第十章：网页设计与制作的未来趋势10.1 教学目标让学生了解网页设计与制作的未来趋势和发展方向让学生掌握前沿技术和创新思维的方法10.2 教学内容网页设计与制作的未来趋势和发展方向（如VR/AR、等）前沿技术和创新思维的方法（如Blockchn、Design Thinking等）创新项目和案例分析10.3 教学方法讲授法：讲解网页设计与制作的未来趋势和发展方向实践法：学生进行创新项目和思维训练10.4 教学评价学生能回答出网页设计与制作的未来趋势和发展方向学生能理解并运用前沿技术和创新思维的方法学生能独立完成创新项目和案例分析重点和难点解析重点环节一：网页设计的概念和原则重点关注学生对网页设计的基本理解，以及如何运用设计原则进行网页创作。

第1章网站规划在建立网站之前，需了解网站的开发流程，按照项目管理模式对网站进行必要的规划、开发、测试和发布使用。

一般流程如下：1.建设网站前进行必要的市场分析。

2.明确建设网站的目的及功能定位。

3.制定网站技术解决方案。

4.根据网站的目的确定网站内容、网站结构和网站功能。

5.进行网页设计，并根据技术方案实施网站建设。

6.做出经费预算。

7.网站测试。

8.网站发布及推广。

9.网站维护。

第2章网站基础知识网站（Website），是指在因特网上根据一定的规定，使用HTML等工具制作的用于展示特定内容的相关网页的集合。

网站的组成●域名（Domain Name），是由一串用点分隔的字母组成的Internet上某一台计算机或计算机组的名称。

●空间，常见网站空间有虚拟主机、虚拟空间、独立服务器、VPS。

●程序，即建设与修改网站所使用的编程语言，换成源码就是一堆按一定格式书写的文字和符号。

●网页网页（Web page），是网站中的任意一个页面，通常是HTML格式，文件扩展名为html、或htm、或asp、或aspx、或php、或jsp等。

●基本构成元素：文字、图像、超级链接。

●阅读方式：浏览器。

●类型：以不同的后缀代表不同类型的网页文件。

通常分为静态页面、动态页面。

动态网页（active web page）：指网页内容可根据用户的不同请求从而返回其对应的数据，一般情况下动态网页通过数据库进行架构，一般文件名均以开发语言做后缀，如php、asp等。

也可以说凡是结合了HTML以外的高级程序设计语言和数据库技术进行的网页编程技术生成的网页都是动态网页。

静态网页：指全部由HTML标记页面，页面的内容和显示效果基本不发生变化，所有的内容包含在网页文件中。

一般文件名均以htm、html、shtml等为后缀。

术语WWW（World Wide Web），亦称作“Web”、“WWW”、“'W3'”，中文名字为“万维网”，"环球网"等，常简称为Web。

网页设计与制作教程网页设计与制作是一门很有趣的技术，可以通过学习和实践来掌握。

下面将为大家分享一些关于网页设计与制作的教程。

第一步：准备工作在进行网页设计与制作之前，首先要做好准备工作。

这包括确定网页的主题和目标，以及收集所需的素材和资源。

可以通过调研、分析竞争对手和用户需求来确定网页的主题和目标。

同时，也要收集所需的图片、文字和其他媒体资源。

第二步：规划网页结构在进行网页设计与制作之前，需要规划网页的结构。

这可以通过制作网页原型来实现。

网页原型是网页的草图，可以用纸笔或专门的原型工具来制作。

在制作网页原型时，要考虑网页的布局、导航和内容组织。

第三步：选择合适的设计风格选择合适的设计风格是网页设计与制作的重要一步。

可以根据网页的主题和目标来选择适合的设计风格。

常见的设计风格包括简约风格、扁平化风格和材料设计风格等。

在选择设计风格时，要考虑网页的整体风格和用户体验。

第四步：设计网页布局设计网页布局是网页设计与制作的核心环节。

可以使用设计软件或代码来实现网页布局。

要注意网页的整体结构和各个部分的排列。

可以使用网格系统来实现网页布局，使网页看起来更加整齐和美观。

第五步：添加内容和媒体在设计网页布局之后，可以开始添加内容和媒体。

这包括文字、图片、音频和视频等。

在添加内容和媒体时，要注意选择合适的字体、颜色和大小，并保持整体风格的一致性。

同时，也要考虑内容的可读性和媒体的加载速度。

第六步：优化网页性能优化网页性能是网页设计与制作的重要一环。

可以通过压缩图片、合并脚本和样式表、使用缓存等技术来提升网页的加载速度。

还可以进行网页的优化测试，找出并解决性能问题。

第七步：测试和发布网页在完成网页设计与制作之后，要进行测试和发布。

可以在不同的浏览器和设备上进行测试，确保网页在各种环境下正常显示和运行。

测试通过后，可以将网页发布到线上服务器，并进行必要的优化和维护工作。

综上所述，网页设计与制作需要经过一系列的步骤，包括准备工作、规划网页结构、选择设计风格、设计网页布局、添加内容和媒体、优化网页性能、测试和发布网页。

网页设计与制作教程网页设计与制作教程网页设计与制作是一门充满创造力和技术性的艺术，它涉及到许多方面的知识和技能。

下面是一个简单的网页设计与制作教程，帮助初学者入门。

第一步：规划和研究在开始设计和制作网页之前，首先需要规划和研究。

明确网页的目标和需求，了解目标受众和他们的需求。

同时研究一些优秀的网页设计作品，学习他们的布局、配色和排版等。

第二步：设计草图设计草图是设计师将想法落实为可视化的工具。

可以使用纸和笔，也可以使用草图设计软件。

在设计草图中，要考虑网页的整体布局、主要内容块、导航栏、配色等。

第三步：创建原型原型是一个初步的网页模型，用于展示网页的功能和交互。

可以使用线框图或者原型设计软件创建原型。

原型的制作，可以将设计草图转化为更真实的网页样式。

第四步：编写HTML和CSSHTML是网页的骨架，CSS是网页的样式。

在这一步中，需要学习HTML标签和CSS属性，了解如何创建网页的基本结构和样式。

可以使用文本编辑器编写HTML和CSS代码。

第五步：图像和多媒体网页设计中常常需要图像和多媒体元素来增强用户体验。

可以使用图像编辑软件创建和优化图像，使用多媒体文件来添加音频、视频等。

第六步：响应式设计响应式设计是指网页能够适应不同屏幕尺寸和设备。

可以使用CSS媒体查询来实现响应式设计。

在设计和制作网页时，要考虑不同设备的适配。

第七步：测试和优化在完成网页设计和制作后，需要进行测试和优化。

测试网页在不同浏览器和设备上的显示和功能是否正常。

可以使用一些测试工具和技术来辅助测试，如浏览器兼容性测试工具和网页性能测试工具。

第八步：发布和维护在网页测试通过后，就可以发布到服务器上，让用户可以访问。

同时需要定期维护网页，更新内容、修复bug等。

可以使用一些网页分析工具来了解网页的访问情况，从而做出优化和改进。

以上就是一个简单的网页设计与制作教程。

通过学习和实践，不断提升自己的设计和制作能力，打造出漂亮、实用的网页作品。

《网页设计与制作》笔记第一章：网页设计基础1.1网页设计的定义与重要性1.2网页设计的历史与发展1.3设计原则与最佳实践1.4用户体验的基本概念第二章：网页设计工具与技术2.1设计软件介绍（如Photoshop、Sketch）2.2前端开发工具（如HTML、CSS、JavaScript）2.3响应式设计与框架（如Bootstrap、Foundation）2.4版本控制与协作工具（如Git、GitHub）第三章：网页布局与结构3.1网页布局的基本概念3.2网格系统与布局设计3.3导航设计与信息架构3.4模块化设计与组件化开发第四章：色彩与字体选择4.1色彩理论与配色技巧4.2字体的选择与排版4.3色彩与品牌形象4.4可访问性与色彩使用第五章：网页内容与互动5.1内容策略与信息呈现5.2图像与多媒体的使用5.3互动设计与用户反馈5.4SEO基础与内容优化第六章：网页测试与上线6.1测试类型与测试工具6.2性能优化与加载速度6.3上线流程与维护建议6.4数据分析与用户行为追踪第1章：网页设计基础网页设计的定义与重要性网页设计是指为网站创建和布局视觉内容的过程。

这包括网页的整体外观、结构和交互功能。

网页设计不仅涉及视觉元素的排版和配色，还包括用户如何与网页互动。

一个好的网页设计能够提升用户的体验，增加网站的访问量和转化率。

重要性：1.吸引用户：优秀的网页设计能够第一时间吸引用户的注意，提高用户的留存率。

2.增加可用性：良好的设计帮助用户更容易找到他们所需的信息，减少用户的挫败感。

3.提升品牌形象：专业的网页设计能够增强品牌的可信度和专业形象。

4.搜索引擎优化：设计良好的网页更容易被搜索引擎抓取，从而提升网站在搜索结果中的排名。

考试要点：网页设计的定义及其组成部分网页设计对用户体验和品牌形象的影响网页设计在市场营销中的作用网页设计的历史与发展网页设计的起源可以追溯到20世纪90年代初。

当时网页主要是以文本为主，简单的超链接连接不同的信息。

网页设计与制作教案一、教案简介本教案主要介绍网页设计与制作的基本知识，包括网页设计的原理和流程、网页设计工具的使用以及常用的制作技巧。

通过本教案的学习，学生将能够了解网页设计与制作的基本概念和操作方法，掌握基本的设计技巧，培养良好的审美观和设计思维。

二、教学目标1.了解网页设计与制作的基本原理和流程；2.掌握常用的网页设计工具的使用方法；3.掌握网页制作的基本技巧，如页面布局、颜色搭配等；4.培养良好的审美观和设计思维。

三、教学内容1.网页设计与制作的基本概念1.1 网页设计的定义和作用1.2 网页设计的原则和要素1.3 网页制作的基本流程2.网页设计工具的使用2.1 Adobe Photoshop的基本操作2.2 Adobe Illustrator的基本操作2.3 前端开发工具的选择和使用3.网页制作的基本技巧3.1 页面布局与导航设计3.2 图片处理与优化3.3 色彩搭配与视觉效果3.4 文字排版与字体选择3.5 响应式设计与移动端适配四、教学过程1.导入与激发兴趣通过展示一些精美的网页设计案例，引起学生对网页设计的兴趣，并介绍网页设计的重要性和应用领域。

2.基础知识讲解讲解网页设计与制作的基本概念、原则和流程，并引导学生思考与网页设计相关的实际问题和案例。

3.工具使用演示通过实际操作演示Adobe Photoshop和Illustrator的基本使用方法，让学生熟悉工具的界面和功能，并进行实践练习。

4.设计技巧讲解通过案例分析和实例演示，讲解网页设计的基本技巧，如页面布局、颜色搭配、图片处理等，并引导学生进行创意设计。

5.实践操作与作品展示让学生自行设计一个简单的网页，并进行实践操作，通过小组展示和讨论，分享设计成果和经验。

6.总结与评价对本节课的学习内容进行总结和评价，并对学生的表现给予肯定和建设性的反馈。

五、教学资源1.计算机及相关软件工具：Adobe Photoshop、Adobe Illustrator等；2.教学案例和设计素材：精美的网页设计案例、图片和图标等；3.教学辅助工具：投影仪、电脑、音响等。

《网页设计与制作》教案第一章：网页设计基础1.1 网页设计概述介绍网页设计的概念、目的和重要性讨论网页设计的标准和原则1.2 网页设计流程讲解网页设计的基本流程，包括需求分析、设计稿、切片、编码和测试等步骤1.3 网页设计工具介绍常用的网页设计工具，如Photoshop、Dreamweaver、Fireworks等第二章：HTML与CSS基础2.1 HTML概述介绍HTML的概念、作用和基本结构2.2 HTML标签讲解常用的HTML标签，如、段落、图像、、列表等2.3 CSS概述介绍CSS的概念、作用和基本语法2.4 CSS选择器讲解常用的CSS选择器，如类选择器、ID选择器、属性选择器等第三章：网页布局与排版3.1 网页布局概述介绍网页布局的概念和重要性3.2 常用的网页布局方法讲解常用的网页布局方法，如固定布局、百分比布局、弹性布局等3.3 排版与字体介绍排版和字体的概念、作用和常用属性3.4 响应式网页设计讲解响应式网页设计的概念、方法和实现方式第四章：网页特效与交互4.1 网页特效概述介绍网页特效的概念和作用4.2 JavaScript基础讲解JavaScript的概念、作用和基本语法4.3 常用的网页特效与实例讲解常用的网页特效，如鼠标悬停效果、下拉菜单、滚动动画等，并提供实例进行演示4.4 交互式网页设计讲解交互式网页设计的概念、方法和实现方式第五章：网页设计与制作实践5.1 实践项目概述介绍实践项目的需求和目标5.2 网页设计稿制作根据实践项目需求，使用设计工具制作网页设计稿5.3 网页编码与测试使用HTML和CSS编写网页代码，并进行测试和调试讲解网页发布的步骤和注意事项，以及常用的网页推广方法第六章：网页图像与多媒体6.1 图像格式与优化介绍常见的网页图像格式，如JPG、PNG、GIF等，以及图像优化方法6.2 音频与视频讲解如何在网页中嵌入音频和视频，以及常用的媒体格式6.3 Flash动画介绍Flash动画的概念、制作方法和在网页中的应用6.4 动态效果与动画讲解如何在网页中实现动态效果和动画，包括使用CSS动画和JavaScript实现第七章：网页服务器与数据库7.1 服务器概述介绍网页服务器的概念、作用和常用服务器软件7.2 数据库概述介绍数据库的概念、作用和常用数据库管理系统7.3 动态网页制作基础讲解动态网页制作的基本原理，如服务器端编程和数据库连接7.4 实践项目：搭建简易的个人博客系统讲解如何使用服务器和数据库搭建一个简易的个人博客系统，包括前端设计和后端编程第八章：网页安全与SEO介绍网页安全的概念和重要性，以及常见的网络安全威胁8.2 网页安全措施讲解如何防范网络攻击和提高网页安全性，如使用SSL证书、X-Frame-Options 等8.3 SEO概述介绍搜索引擎优化（SEO）的概念、作用和方法8.4 SEO实践技巧讲解如何优化网页内容、结构和，以提高搜索引擎排名第九章：网页设计与制作的进阶技巧9.1 响应式网页设计深入讲解响应式网页设计的原理和实践方法，包括媒体查询和弹性布局9.2 前端框架与库介绍常用的前端框架和库，如Bootstrap、jQuery、React等，以及如何使用它们提高网页制作效率9.3 网页性能优化讲解如何提高网页加载速度和性能，包括图片优化、代码压缩和缓存策略9.4 实践项目：制作一个响应式商务网站讲解如何使用响应式设计和前端框架制作一个商务网站，包括布局、样式和交互设计第十章：网页设计与制作的拓展与趋势10.1 网页设计与制作的未来趋势探讨网页设计与制作的发展方向，如虚拟现实（VR）、增强现实（AR）等技术的应用10.2 网页设计规范与最佳实践介绍网页设计规范和最佳实践，以提高网页质量和用户体验10.3 跨平台网页设计与制作讲解如何使用跨平台技术，如PWA（Progressive Web Apps）、Node.js等，实现网页在不同平台和设备的兼容性和性能10.4 实践项目：制作一个跨平台的网页应用重点和难点解析重点环节1：网页设计基础和流程网页设计的标准和原则是设计的基石，需要重点掌握。

Dreamweaver网页设计与制作教程第一章：Dreamweaver的介绍与安装Dreamweaver是一款著名的网页设计与制作工具，由Adobe公司开发。

本章将介绍Dreamweaver的功能特点与优势，并提供详细的安装步骤和注意事项。

第二章：Dreamweaver的界面与工具栏在本章中，我们将深入了解Dreamweaver的界面布局，包括工具栏的功能和使用方法。

通过熟悉Dreamweaver的界面，可以提高工作效率。

第三章：网页设计基础知识本章将介绍网页设计的基础知识，包括HTML、CSS、JavaScript等的概念和用法。

了解这些基础知识对于进行网页设计和制作至关重要。

第四章：网页布局与设计在本章中，我们将学习如何在Dreamweaver中进行网页布局与设计。

包括DIV布局、响应式设计等常用技术和方法，以及一些设计原则和注意事项。

第五章：网页文本与图像处理网页中的文本和图像是网页设计中重要的元素。

本章将介绍如何在Dreamweaver中对文本和图像进行处理，如字体设置、锚点链接、图像优化等技巧。

第六章：网页导航与交互设计网页导航和交互设计是网页设计中至关重要的部分。

在本章中，我们将学习如何使用Dreamweaver创建导航菜单、表单、按钮等交互元素，提升用户体验。

第七章：网页动画与多媒体元素网页动画和多媒体元素可以增加网页的吸引力和互动性。

本章将介绍如何在Dreamweaver中使用HTML5和CSS3技术创建动画和嵌入多媒体元素。

第八章：网页调试与代码优化在网页设计和制作过程中，调试和代码优化是必不可少的环节。

本章将介绍Dreamweaver中的调试工具和一些常见的代码优化技巧，帮助提高网页的性能和稳定性。

第九章：网页发布与维护完成网页设计与制作后，下一步就是将网页发布到互联网上。

本章将介绍如何使用Dreamweaver将网页上传至服务器，并提供一些维护和更新网页的技巧。

第十章：常见问题与解决方法在使用Dreamweaver进行网页设计与制作的过程中，可能会遇到一些问题和困惑。

目录实训1 站点创建实训2 搜集素材实训3 用表格设计主页布局实训4 在主页制作中插入文本操作实训5 在主页制作中插入图像操作实训6 在主页制作中超级链接的设置实训7 制作动感网页实训8 表单制作实训9 CSS样式表的使用实训10 JavaScript技术实训11 应用行为实训12 利用框架制作“公司简介"网页实训13 利用布局表格制作“新书推介”网页实训14 模板和库的使用实训15 利用层的布局制作“技术支持”网页实训16 网页设计与网站管理实训17 网站开发综合实训实训1 站点创建实训目的为了让学生能熟练掌握创建站点的方法，掌握设置网页的页面属性，掌握创建网站目录结构、栏目文件夹、网页文件的基本操作方法。

实训环境硬件环境：考核用机为奔腾以上兼容机，内存不少于 32M ，最好 64M 或128M ;硬盘不小于 500M ； VGA 彩显,带鼠标器。

操作系统：Windows95/98/me/2000/XP软件环境:Dreamweaver MX 2004特殊要求：必须将IIS配置好，能正常进行WEB浏览素材准备准备制作网页所需的文字素材.实训课时2学时实训内容创建站点：创建网站目录结构：创建栏目文件夹:创建网页文件：掌握设置网页的页面属性实训要求要求学生能掌握如何创建站点，正确创建网站目录结构及栏目文件夹，创建主页文件index。

htm，并正确命名，掌握设置网页的页面属性的方法.实训步骤1、在E盘中新建本地根文件夹，命名为bookman，并在该文件夹中新建image 文件夹以存放网站中所要用到的图片。

2、定义站点：设置”站点名称”，命名为 "博客人";设置本地根文件夹，指定为E盘下的bookman文件夹;设置 "HTTP地址"为localhost.3、创建网站目录结构及栏目文件夹（如下图）：4、E盘下的bookman文件夹创建主页文件index。

htm5、设置网页的页面属性。

《网页设计与制作》教学大纲第一部分大纲说明一、课程的性质和任务：《网页设计与制作》是一门操作性和实践性很强的课程,为网络专业和计算机相关专业的必修课。

本课程的主要内容包括了网页编辑与制作软件Dreamweaver MX建站的全过程。

教材体现网页制作技术的的特点，注重实用性和操作性,综合讲述了网页制作中的网页编辑、Web图像制作以及网页中动画设计的基本概念和基本操作技能。

书中文字叙述简单明了、通俗易懂。

按照Macromidia公司出品的网页制作系列软件的系统内容，由浅入深、循序渐进，符合学习者的认知规律。

书中列举了部分实例，各章都编排了适量的习题、思考题，以使学生更好地理解和掌握书中所讲述的内容。

二、培养目标：结业后能独立完成公司或个人主页的制作、维护、站点管理、设计制作精美的网页，能够更好地把企业通过互联网推向全球，并通过考试可获得网页设计师相关证书。

三、授课对象：高职高专类网络专业和计算机相关专业四、课程的特点和教学基本要求课程在重点介绍网页设计软件Dreamweaver MX的操作与应用的基础上，通过大量实例和光盘教学素材，详细地阐述了网页设计软件的应用技巧，使学生在学习过程中得以融会贯通，掌握网页设计软件的高级应用。

同时，授课过程中将始终遵循“用户界面感受第一”的基本原则，教导学生在策划、设计过程中设身处地为用户着想，让创意为用户服务，培养学生独立思考、独立创作的良好学习习惯，为学生成为一名优秀的网页设计师打下坚实的基础。

课程设置的根本思路是为使学生能够最大程度满足企业对于网页设计人员的需求，达到学以致用的目的，从而为企业培养优秀的网页设计实用人才。

五、课程教学要求的层次1、掌握：在网页文档中添加文本和文本的格式化方法、插入日期和时间、插入水平线、设置网页的属性等操作方法。

在Dreamweaver MX中使用的图像格式、在网页文档中插入图像、为页面背景添加图像、图像属性的设置、图像与文本的混合排版、设置图像的位置和边框、设置图像的缩略图的操作方法，会使用图像编辑器，会在网页中插入翻转图像和导航条的操作、表格的组成和基本操作方法及创建表格、表格操作、表格编辑的方法、表格和单元格的属性设置，会用表格组织网页的总体布局，掌握使用布局视图布局页面的总体布局。

208
图11-25 “Spry折叠式”和“属性”面板图11-26 “Spry折叠式”形式
11.2.5 Spry可折叠面板
Spry可折叠面板是一个面板，它可将内容同存储在紧凑的空间中，用户单击控件的选项卡即可隐藏或显示存储在可折叠面板中的内容。

①在网页中单击“插入”面板“布局”分类中的“Spry可折叠面板”按钮，如图11-1所示。

②在网页“设计”视图中显示了插入的折叠式面板构件，如图11-27所示。

图11-27 “Spry可折叠面板”和“属性”面板
③网页“设计”视图中的“标签”表示面板的名称，单击可重命名标签。

“内容”区域中可插入各种HTML标签，表示会被隐藏或显示的内容。

④“属性”面板中的“显示”列表框表示在编辑时打开或关闭面板，“默认状态”表示在浏览器中浏览时默认是打开还是关闭面板。

11.3 综合案例：制作导航条
导航条是网站的重要组成部分之一，访问者可以通过导航条快速访问指定的位置，方便浏览网站的内容。

本练习将通过在网页文档中插入Spry菜单栏制作网站导航条，操作步骤如下。

①新建站点，或从“文件”面板中打开“index.html”，切换到“拆分”视图。

②将光标置于ID为main的Div层中，单击“插入Div标签”按钮，创建ID为nav的层。

“代码”视图中页面整体布局代码如下所示。

<div id="main">
<div id="nav"></div>
</div>
<div id="copyright">
</div>。