dreamweaver8_简单网页制作
Dreamweaver8系列DIV+CSS教程网页标准布局实例教程(二)
div+css网页标准布局实例教程（二）五、布局页面——头部和导航有了上边的基础，下面的任务就是要利用html和css制作完成一个完整的网页了。
先从头部开始，第三小节时我们已经把整体框架给搭建好了，就像盖房子一样，整体结构已经出来了，下面就需要填砖分割空间了。
先分析下头部：分为两部分，一个是logo靠左侧显示，一个是搜索靠右侧显示，那么布局时插入两个div，一个向左浮动，一个向右浮动的方式来完成。
另外还有很多种实现方法，比如logo用h1标签，搜索用span，或者把log o做为背景图片也是可以的，不管采用哪种方法，要根据页面的需求选用一种最合理的方法。
如果要在logo加上链接的话，那么就不能用背景图片的方法了。
<div id="header"><div id="logo">此处显示id "logo" 的内容</div><div id="search">此处显示id "search" 的内容</div></div>先在header里插入以上两块元素。
然后分别插入相应的内容，在logo里插入我们事先切割好的logo图片，在search里插入一个表单，一个文本框和一个按钮，插入后如下：<div id="header"><div id="logo"><img src="images/logo.gif" width="181" height="45" /></div><div id="search"><form id="form1" name="form1" method="post" action="">搜索产品<input type="text" name="textfield" id="textfield" /><input type="submit" name="button" id="button" value="查询" /></form></div></div>接下来定义css吧，在ps里测量，头部的高度是71px，logo距顶部18px，搜索产品距顶部30px，下面在css里把这些参数都给定义上，看显示的效果和效果图中的效果是不是一样呢？#logo { float:left; margin-top:18px;}#search { float:right; margin-top:30px;}这两项的位置已经差不多了。
Dreamweaver 8 创建和编辑网页
网页设计与制作——《 Dreamweaver 8 教程》讲义
五、修改网页属性：
2. 【页面属性】对话框
• 外观
【外观】选项卡
网页设计与制作——《 Dreamweaver 8 教程》讲义
五、修改网页属性：
2. 【页面属性】对话框
• 链接
【链接】选项卡
网页设计与制作——《 Dreamweaver 8 教程》讲义
【文件】面板
网页设计与制作——《 Dreamweaver 8 教程》讲义
五、修改网页属性：
1. 网页的基本属性
• 外观属性——指页面中文本的字体、字样、大小、颜 色、背景颜色和背景图像，以及页面边距的设置。 • 链接属性——指链接文本的字体、大小，链接文本的 颜色，鼠标指针指向链接文本时的颜色，已访问过的链 接文本的颜色，单击链接文本时的颜色，以及下画线的 样式。
1. 通过【打开】对话框打开文档
• 选择【文件】| 【打开】命令， 弹出【打开】对 话框，选择所需 的网页文档，单 击【打开】按钮。
【打开】对话框
网页设计与制作——《 Dreamweaver 8 教程》讲义
四、打开已有文档：
2. 通过【文件】面板打开文档
• 显示【文件】面板， 在面板左上方的【站 点】下拉列表框中选 择保存网页的站点、 服务器或驱动器，然 后在文件和文件夹列 表中双击所需网页文 档的图标。
三、网页的保存：
• 保存当前网页：选择【文件】|【保存】命令，弹出 【另存为】对话框，打开所需站点文件夹，在【文件夹】 文本框中输入网页名称，然后单击【保存】按钮。 • 保存已创建的所有页面：选择【文件】|【保存全部】 命令。
网页设计与制作——《 Dreamweaver 8 教程》讲义
dreamweaver8网页设计教程
《dreamweaver8网页设计》目录第一章遨游DREAMWEA VER8精彩世界1第二章创建与规划站点3第三章文本及其格式化10第四章表格13第五章图像15第六章框架18第七章页面布局视图的使用21第八章链接24第九章层与时间轴 28第十章表单32第十一章行为35第十二章制作动态页面38第十三章代码片断、库项目和模板 42第十四章网页的制作45第十五章网站的测试与上传49第十六章使用FIREWORKS 8处理网页图像 52第一章遨游Dreamweaver8精彩世界课题：Dreamweaver8简介及创建文档一、教学基本内容1、Dreamweaver8 的工作界面2、建立html文档二、课型：新授课三、课时：2个课时四、教学重点与难点重点：熟悉Dreamweaver8工作界面中各个工具的作用难点：1、各个面板的调用2、建立一个HTML的网页3、插处图像五、教学目的1 、对Dreamweaver这个制作网页的工具及网页有一定的认识，激发学生学习网页设计的兴趣2、一定要学会建立一个空白网页3、会对页面有一个简单的设置六、教学过程1、引入（1）为什么要用Dreamweaver而不用Frontpage?Dreamweaver是Macromedia公司的出品，它以程序小、运行速度快、所制作网页代码少这些优点，赢得了网页制作人员的喜爱。
（2）相关工具的介绍因为这是第一节网页制作课，所以首先要简单介绍下制作网页的一些相关工具，比如与Dreamweaver合称为网页三剑客的Flash和Fireworks。
2、讲授新课（1） Dreamweaver的界面a．文档窗口：主菜单、工具栏、底部启动条、文档编辑区b．对象面板：标准、表格、表单、框架、特殊、文件廷冖隐藏、字符c．启动面板：站点管理、代码检查、HTML样式、CSS样式、行为、历史记录、资源管理d．属性面板：随目前对象不同而内容不同(2)创建HTML网页(3)在网页中插入图像输入文字以后，插入图像，并对图像设置对齐的方式，使之与文字呈混排的状态。
利用Dreamweaver8软件制作网站
利用Dreamweaver8软件制作网站摘要：Dreamweaver8是建立Web站点和应用程序的专业工具。
它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。
本文在实施制作过程中充分的体现出了Dreamweaver8的强大功能。
本文主要分为四各部分。
第一部分介绍Dreamweaver8，第二部分讲述利用Dreamweaver8制作网站的主要过程与步骤，第三部分讲述在运用Dreamweaver8时需注意的一些地方与一些心得。
前言Dreamweaver是美国Macromedia公司开发的集网站制作和网站管理于一身的所见即所得的网页编辑器，它是第一套针对专业网页设计师特别开发的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
Dreamweaver是专业可视化网站开发的先锋。
在2000年，为了响应Web开发者中越来越普遍的服务器技术，Macromedia推出了Dreamweaver UltraDev。
此产品提供了Dreamweaver的功能和用于采用ASP、JSP、ColdFusion 创建Web应用程序工具的功能。
Dreamweaver8是在旧版本的基础之上构建的，通过在主要领域（如XML和CSS）扩展功能并简化工作流程来帮助用户在最短时间内完成更多工作。
通过支持最新的专业设计方法，Dreamweaver8采用Web社区所使用的强大的开放式、基于标准的开发。
Dreamweaver8还支持所有主要服务器技术，包括ColdFusion、PHP、ASP、和JSP，使所有技术级别的开发者的设计都栩栩如生。
一、Dreamweaver8特点Dreamweaver是在网页设计与制作领域中用户最多、应用最广、功能最强大的软件，随着Dreamweaver 8的发布，更坚定Dreamweaver在该领域的地位。
Dreamweaver8中文版网页制作基础课程设计
Dreamweaver8中文版网页制作基础课程设计课程范围本课程旨在教授Dreamweaver8软件的基础知识，包括网页制作的基础知识、网页设计的基本原则、标记语言和样式表的应用，以及交互设计的概念和技能。
具体而言，学生将学习以下技能：1.熟练掌握Dreamweaver8软件的常用菜单和工具2.了解HTML、CSS、JavaScript编程语言的基础知识3.能够使用HTML语言建立网页的框架结构、插入多媒体元素和超链接4.能够使用CSS语言为网页添加样式和布局5.能够使用JavaScript语言进行简单的交互设计教学方法本课程采用理论教学和实践教学相结合的方法。
在课堂上，老师将结合案例分析和操作演示来讲解理论知识，并设置相关练习来帮助学生巩固所学的知识。
在实践环节，学生将根据老师的指导自行制作网页，并展示自己的成果。
在课程结束后，学生将提交一个网页设计作品，并进行评分和点评。
教学安排本课程共分为10个单元，每个单元包括理论讲解和实践环节。
具体教学安排如下：单元1：Dreamweaver8软件介绍和安装1.Dreamweaver8软件介绍2.Dreamweaver8软件安装与配置3.Dreamweaver8主界面介绍单元2：网页与网站基础知识1.网页的基本概念和类型2.网站的基本结构3.网页设计的基本原则单元3：HTML语言基础1.HTML语言介绍2.HTML语法规则和标签3.HTML文档结构单元4：HTML语言进阶1.HTML链接和嵌入对象2.HTML表格和表单3.HTML图像和图像映射单元5：CSS语言基础1.CSS语言介绍2.CSS语法规则和选择器3.CSS样式和优先级单元6：CSS语言进阶1.CSS盒模型和布局2.CSS动画和过渡3.CSS响应式设计单元7：JavaScript语言基础1.JavaScript语言介绍2.JavaScript语法规则和语句3.JavaScript变量和数据类型单元8：JavaScript语言进阶1.JavaScript函数和对象2.JavaScript事件和事件处理3.JavaScript DOM和jQuery库单元9：网页交互设计1.网页交互设计概念和原则2.网页交互设计工具和方法3.网页交互设计案例分析单元10：综合实践和评估1.自主设计网页2.网页制作实践3.网页作品评估和点评教学要求1.学生需要自备Dreamweaver8软件和相关教材2.学生需要参加所有的课程和实践环节3.学生需要完成作业和网页设计作品4.学生需要积极参与讨论和问答环节评分标准1.准时到课和积极参与讨论和问答环节（10%）2.网页制作作业（40%）3.网页设计作品（50%）。
Dreamweaver8中文版网页制作基础教学设计 (2)
Dreamweaver8中文版网页制作基础教学设计1. 前言随着互联网技术的飞速发展，越来越多的人开始关注网页制作技术。
而Dreamweaver作为最受欢迎的网页制作工具之一，为网页设计师提供了强大的支持。
本教学将介绍Dreamweaver8中文版的基础知识及其使用，希望能够帮助初学者顺利入门网页制作。
2. Dreamweaver8中文版的介绍Dreamweaver8是由Adobe公司推出的一款网页制作工具。
它的主要特点有以下几点：•WYSIWYG编辑器：所见即所得的编辑模式，方便用户快速制作网页。
•支持多种编程语言：Dreamweaver8支持HTML、CSS、JavaScript等多种编程语言，可以轻松制作复杂的网页。
•内置库和模板：Dreamweaver8内置了大量的库和模板，可以加速用户的工作流程。
•图形用户界面：Dreamweaver8的用户界面非常直观，易于使用，适合初学者入门。
3. Dreamweaver8中文版的安装要学习Dreamweaver8中文版的使用，首先需要在电脑上进行安装。
以下是安装步骤：1.下载Dreamweaver8的安装文件（建议从官方网站下载）。
2.运行安装文件，按照提示进行安装。
3.在安装过程中，可以选择要安装的组件和安装路径。
4.安装完成后，双击Dreamweaver8的图标即可启动程序。
4. Dreamweaver8中文版的界面Dreamweaver8的界面分为以下几个部分：•菜单栏：包含Dreamweaver8的各种功能选项。
•工具栏：包含用于网页制作的各种工具。
•文件管理器：用于管理网页文件。
•代码编辑器：用于输入和编辑HTML、CSS等编程语言的代码。
•设计视图：所见即所得的编辑模式，方便用户制作网页。
5. Dreamweaver8中文版的基础操作在学习使用Dreamweaver8之前，需要掌握一些基础操作。
下面介绍几个常用的基础操作：5.1 新建网页1.在菜单栏中选择“文件”->“新建”，或在工具栏中点击“新建”按钮。
第8章网页制作工具Dreamweaver8
相关的属性，用于为“文件”面板设置站点首选参数，如图814所示。
图8-14 站点参数设置
8
8.2 站点管理
所谓站点，可以看做是一系列文档的组合，这些文档之 间通过各种链接关联起来，可能拥有相似的属性，例如，描 述相关的主体，采用相似的设计，或者实现相同的目的等， 也可能只是毫无意义的链接。利用浏览器，就可以从一个文 档跳转到另一个文档，实现对整个网站的浏览。 8.2.1 本地站点和远端站点
图8-64 实例效果
【例8-8】
22
8.7 使用表格
8.7.1 插入表格 表格是页面布局极为有用的设计工具。在设计页面时，往
往要利用表格来定位页面元素。使用表格可以导入表格化数据， 设计页面分栏，定位页面上的文本和图像等。 在Dreamweaver中插入表格的方法如下。 ① 将光标放到要插入表格的位置。 ② 执行下列操作之一：
（1）插入工具栏 Dreamweaver 8的插入工具栏如图8-4（a）所示，插入工
具栏中默认显示的是“常用”类的主要功能按钮。单击“常用”按 钮会弹出一个下拉菜单，其中包含了插入工具栏中的其他功能 菜单，如图8-4（b）所示。用户选择不同的分类，插入工具栏 中包含的功能按钮也随之改变。
图8-4 插入工具栏及其功能分类菜单
如果需要设置网页的其他属性，可以打开“页面属性”对 话框进行设置。
14
8.3 制作第一个网页
8.3.3 网页基本元素 在通常情况下，网页上一般都包含文本、日期、特殊符号
及水平线等基本元素。 1．文本和特殊符号
文本的操作主要包括：输入文字、设置文字大小、设置字 体、设置文本颜色、设置文本对齐方式等。 2．日期
Dreamweaver 8网页设计
（3） DIV布局 DIV是一个容器，可以放置内容。DIV+CSS=内容+表现 优点：代码精简、提高页面下载速度、表现和内容相分离等 缺点：比较灵活难于控制 应用场合：复杂的不规则页面、业务种类较多的大型商业网站
使用CSS美化页面
一、认识CSS： CSS是Cascading Style Sheets的缩写，称为“层叠样式表”。 “样式”就是格式，文字的大小，颜色等网页内容的样式。 “层叠”是指在HTML文件中引用数个定义样式的样式文件时，若数个样式文件 间所定义的样式发生冲突，将依据层次顺序处理。 二、CSS语法： 1.基本语法： CSS的定义是3部分构成：选择符（selector）、属性（properties）和属性值（ value）。
• <html> • <frameset cols="25%,50%,25%"> • <frame src="/example/html/frame_a.html"> • <frame src="/example/html/frame_b.html"> • <frame src="/example/html/frame_c.html"> • <noframes> • <body>您的浏览器无法处理框架！</body> • </noframes> • </frameset> • </html>
• 2.9 框架 – 表格和层均是以插入的对象为单位，而框架则不同， 它是以插入的网页为单位，它提供了一种较为固定的 网页结构。
（1）框架的基本结构 <HTML> <HEAD> <TITLE>rows_cols框架</TITLE> </HEAD> <FRAMESET rows="25%,50%,*" border="5"> <FRAME name=“top" src="the_first.html"> <FRAME name="middle" src="the_second.html"> <FRAME name=“bottom" src="the_third.html"> </FRAMESET> <noframes><body>……</body></noframes> </HTML>
如何使用Dreamweaver8进行网页设计和开发
如何使用Dreamweaver8进行网页设计和开发第一章：介绍Dreamweaver8Dreamweaver8是一款专业的网页设计和开发工具，由Adobe公司开发。
它可以帮助开发者创建各种类型的网页，包括静态网页、动态网页和响应式网页。
本章将介绍Dreamweaver8的基本特点和功能，以及如何使用它进行网页设计和开发。
第二章：安装和设置Dreamweaver8在开始使用Dreamweaver8之前，首先需要进行安装和设置。
本章将介绍Dreamweaver8的安装过程，包括下载安装包、运行安装程序和输入序列号。
同时，还会介绍如何进行基本的设置，包括语言选择、默认文件夹设置和主题选择等。
第三章：Dreamweaver8的主要界面本章将介绍Dreamweaver8的主要界面，包括工具栏、菜单栏、面板和编辑窗口等。
同时，还会介绍如何自定义界面，根据自己的工作习惯进行布局和设置。
第四章：创建网页文件在Dreamweaver8中，创建网页文件非常简单。
本章将介绍如何创建一个新的网页文件，包括选择页面模板、设置页面属性和编辑页面内容等。
同时，还会介绍如何导入现有的网页文件，并进行必要的转换和调整。
第五章：网页设计基础网页设计是Dreamweaver8的核心功能之一。
本章将介绍网页设计的基础知识，包括颜色选择、字体选择和布局设计等。
同时，还会介绍如何使用Dreamweaver8中的设计工具，如图像处理工具和样式编辑器等。
第六章：网页开发基础网页开发是Dreamweaver8的另一个重要功能。
本章将介绍网页开发的基础知识，包括HTML、CSS和JavaScript等。
同时，还会介绍如何使用Dreamweaver8中的代码编辑器和调试工具，进行网页开发和调试。
第七章：网页优化和测试在完成网页设计和开发后，需要对网页进行优化和测试。
本章将介绍如何使用Dreamweaver8中的网页优化工具，包括代码优化、图像优化和链接检查等。
Dreamweaver-8网页制作工具
1.创建文本链接
2016/11/17
12
计算机应用能力水平
+
2. 电子邮件链接 3. 创建锚点链接 4. 下载链接
2016/11/17
13
计算机应用能力水平
5. 热点链接
2016/11/17
14
计算机应用能力水平
简单网页制作实例
所用的素材文件链接
2016/11/17
16
计算机应用能力水平
（4）确认设置的内容准确后，单击“确定” 按钮，完成站点的设置。 （5）复制配套的素材的所有文件到桌面 DW13文件夹中，其中图片放在 DW13\images文件夹中。 （6）新建一个主页文件index.htm。 (7)向主页文件中添加文本，内容来自于素 材“海大简介.txt”，可用记事本复制/粘贴 来实现，
2016/11/17 17 计算机应用能力水平
(8) 把光标定位在第一行，选中“上海海事大 学介绍”，设为居中、华文新魏、36像素、 蓝色，其他文字设为宋体、16像素 (9) 在标题与正文之间插入蓝色的水平线， “插入”菜单中选“HTML”“水平线” (10)在文本的最后插入图片，插入/图像里选 素材图片smu1.jpg，设置图片的宽为440、 高为150像素
2016/11/17
3
计算机应用能力水平
Dreamweaver8界面介绍 Dreamweaver 8 激活方法
2016/11/17
4
计算机应用能力水平
Dreamweaver8的标准界面
2016/11/17
5
计算机应用能力水平
Dreamweaver简单网页编辑 网页的基本操作 创建网页 打开网页 保存文件
中文版中文版Dreamwear_8网页设计_第1章
网页的分类
➢按所处位置分类 ➢按表现形式分类
按所处位置分类
按网页在网站中所处的位置可将 网页分为主页和子页两类。
按表现形式分类
按网页的表现形式可将网页分为静 态网页和动态网页。
网页中的常用术语
➢ 万维网（www） ➢ 浏览器 ➢ 统一资源定位符（URL） ➢ 文件传输协议（FTP） ➢ IP地址 ➢ 域名 ➢ 超级链接 ➢ 超级文本标记语言（HTML）
软件。 ➢ 图像处理软件
制作网页图像的软件种类繁多，大多数网页 设计人员选择的是Fireworks或Photoshop。 ➢ 动画制作软件
网页动画制作中最常用的软件非Flash莫属。
认识Dreamweaver 8
使用Dreamweaver 8制作网 页之前，需先将该软件安装 到电脑中，其方法与安装其 他软件相似，用户可根据提 示操作。
网页是由 HTML（超级文 本标识语言）或 者其他语言编写 的，通过IE浏览 器编译后供用户 获取信息的页面， 它又称为Web页， 其中可包含文字、 图像、表格、动 画和超级链接等 各种网页元素。
什么是网站
网站就是一个或多个网页的集合。 从广义上讲，网站就是当网页发布到 Internet上以后，能通过浏览器在 Internet上访问的页面 。 ➢门户网站 ➢职能网站 ➢专业网站 ➢个人网站
设计网页的原则
➢ 整体规划 ➢ 鲜明的主题 ➢ 善用图像 ➢ 醒目的导航 ➢ 及时更新 ➢ 易记的网站名称 ➢ 通用网页 ➢ 动画适量
网页设计的一般步骤
➢规划网站 ➢收集整理资源 ➢配置站点 ➢创建页面 ➢测试站点 ➢发布站点 ➢维护、更新站点
网页制作的常用工具
➢ 网页设计软件 Dreamweaver是目前使用最多的网页设计
Dreamweaver 8入门经典教程
Dreamweaver 8入门经典教程我们已经描绘了小屋的蓝图，从现在开始，为我们的小屋添砖加瓦吧。
打开01.html，制作一个图文混排的简单页面。
一、页面的总体设置1、设置页面的头内容头内容再浏览器中是不可见的，但是却携带着网页的重要信息，如关键字、描述文字等，还可以实现一些非常重要的功能，如自动刷新功能。
鼠标左键单击插入工具栏最左边按钮旁的下拉小三角，在弹出菜单中选择“HTML”项，出现“文件头”按钮，点开下拉菜单，就可以进行头内容的设置了。
设置标题，网页标题可以是中文、英文或符号，显示在浏览器的标题栏中。
我们直接在设计窗口上方的标题栏内输入或更改，就可以完成网页标题的编辑了。
插入关键字，关键字用来协助网络上的搜索引擎寻找网页。
要想让更多的人看见你的网站，这项要好好填哦^_^单击上图所示的“关键字”项，弹出“关键字”对话框，填入关键字即可。
插入META，META标记用于记录当前网页的相关信息，如编码，作者，版权等，也可以用来给服务器提供信息。
单击上图所示的“META”项，弹出“META”对话框，在“属性”栏选择“名称”属性，在“值”文本框中输入相应的值，可以定义相应的信息。
author—作者信息，copyright—版权声明，generator—网页编辑器。
2、设置页面属性单击“属性栏”中的“页面属性”按钮，打开的“页面属性”对话框。
设置外观，“外观”是设置页面的一些基本属性。
我们可以定义页面中的默认文本字体、文本字号、文本颜色、背景颜色和背景图像等。
我们设置页面的所有边距为0。
设置链接，“链接”选项内是一些与页面的链接效果有关的设置。
“链接颜色”定义超链接文本默认状态下的字体颜色，“变换图像链接”定义鼠标放在链接上时文本的颜色，“已访问链接”定义访问过的链接的颜色，“活动链接”定义活动链接的颜色。
“下划线样式”可以定义链接的下划线样式。
设置标题，“标题”用来设置标题字体的一些属性。
如下图所示，在左侧“分类”列表中选择“标题”，这里的标题指的并不是页面的标题内容，而是可以应用在具体文章中各级不同标题上的一种标题字体样式。
Dreamweaver_8_网页设计与制作_第2章53页PPT文档
2.1.1 定义本地站点
图 2.2 选择【管理站点】命令
图 2.3 【管理站点】对话框
2.1.1 定义本地站点
图 2.4 定义站点
2.1.2 编辑站点
1. 打开站点 在创建了站点之后，还可以对站点属性进行编辑。在编辑站点时，首先
要打开站点。 要打开一个本地站点，用户可以从Dreamweaver文档窗口的站点窗口中，
2.1.2 编辑站点
图 2.7 【管理站点】对话框
图 2.8 复制站点
2.1.2 编辑站点
4. 删除站点 如果不再需要利用Dreamweaver对某个本地站点进行操作，
可以将之从站点列表框中删除，具体操作如下。 (1) 在图2.8所示对话框的列表框中选择要删除的站点
“NetBook复制”，如图2.9所示，单击【删除】按钮。 (2) 这时会出现一个提示对话框，如图2.10所示，询问是
1. 创建文件夹 在本地站点中创建文件夹的具体步骤如下。 (1) 在站点窗口的本地站点文件列表窗格中，选中要新建
文件夹的上一级文件夹。 (2) 右击文件夹，在如图2.11所示的快捷菜单中选择【新
建文件夹】命令，即可创建一个新的文件夹。
2.1.3 站点文件的操作
图 2.11 新建文件夹
我们可以把站点看作是一系列文档的组合，这些文档之间 通过各种链接关联起来，可能拥有相似的属性，如描述相 关的主体、采用相似的设计或实现相同的目的等，也可能 只是毫无意义的链接。通过浏览器，我们就可以从一个文 档跳转到另一个文档，实现对整个网站的浏览。
利用Dreamweaver，用户可以在本地计算机上创建出站点 的框架，编辑相应的文档，从整体上对站点全局进行控制。 在这一节中我们将介绍如何构建网站的本地站点。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
•
• •
6）单击“下一步”按钮，在弹出的对话框“您如何连接到远程服务器？”下 拉菜单选择“无”选项。
7）单击“下一步”在弹出的对话框中会所示相关的信息，然后单击“确定”， 完成站点的设置。 8）此时在Dreamweaver8的文件面板就会出现站点的文件夹及所有的文件。
返回 退出
2、制作网页 1
• • • • 1）启动Dreamweaver8新建一个HTML页，命名为“index” 。 2）单击属性面板中的“页面属性”按钮，打开“页面属性”设置对话框， 对页面进行相应的设置，设置完成后点击“确定” 即可。 3）根据课件设计方案，在设置好的网页中添加表格，对表格进行编辑，添加好 相应的文字，预览后保存。
返回
退出
下一页
返回Байду номын сангаас
退出
2、制作网页 2
• 4）在重新创建一个新的网页，命名为“导航页”页面属性的设置同 （2）， • 根据已经设计好的方案，编辑导航页。 • 5）然后分别制作“作者简介”、“课文内容”、“课文分析”、“生词生 字”、 • “课堂练习”、“课后习题”网页。
下一页
返回
退出
2、制作网页 3
网页课件实例
• •
1、创建新站点 2、制作网页
返回
退出
1、创建新站点
• • • • • • 1）在本地计算机硬盘创建一个文件夹，名为“唐诗教学”。 2）打开Dreamweaver 8，在菜单栏打开“站点”选项，执行“新建站 点” 命令。 3）在弹出的对话框中选择“基本”选卡，输入站点的名称。 4）单击“下一步”按钮，在弹出的对话框中选择“否，我不想用服务器技 术”。 5）单击“下一步”按钮，在弹出对话框中选择“编辑我的计算机上的本地副 本，完成后在上传服务器”选项，如图所示。单击按钮，选择站点的位置为先 前创建的文件夹。
• 6）在Dreamweaver 8中，打开导航页，选中“返回主页”文字，在属性
面板链接栏点击打开链接对话框选择主页，单击“确定”。链接即建立完
成，按F12预览， • 7）依次选择“作者简介”、“课文内容”、“课文分析”、“生词生
字”、“课堂练习”、“课后习题”等文字，用同样的方法，分别建立链
接。 • 8）分别用Dreamweaver 8软件依次打开“作者简介”、“课文内容”、 “课文分析”、“生词生字”、“课堂练习”、“课后习题”网页用同样 的方法将每一页的文字全部和相应的网页链接好，整个课件即完成。