ACCP V4.0
第一章
Dreamweaver 使用入门
ACCP V4.02
目标
了解 Internet 和万维网( WWW)
理解与 Dreamweaver 相关的概念
掌握创建网站的操作步骤
掌握如何制作简单网页
掌握如何创建超级链接
ACCP V4.03
Internet 和万维网
全球范围内网络的网络
Internet 的一部分
由包含各种信息的文档组成
ACCP V4.04
万维网 2-1
Web 服务器客户端协议
用于访问 Web 上资源的一组规则
HTTP 是 Web 协议站点地址或 URL
<HTML>
<HEAD>
…………
</HEAD>
<BODY
…………
</BODY>
</HTML>
HTML语言用于制作网页
ACCP V4.05
万维网 2-2
Web 服务器客户端向服务器发送页面请求
Web 服务器处理请求并返回请求的页面
HTTP 负责请求和响应
ACCP V4.06
Web相关术语
网 站,万维网上相关网页的集合
网 页,文件后缀名通常为 *.html 或 *,htm的页面
HTML:用于制作网页的超文本标记语言 (Hyper
Text Mark-up Language)
ACCP V4.07
Dreamweaver MX 2004
一 款用于 设计、开发网站和 Web 应用程序的专业 HTML 编辑器
用户可以选择使用布局单元格或框架来设计页面的布局
可用于创建文本、插入动态图像、提供网页超链接、创建 Flash 文本和 Flash 按钮等
可 用于组合由某些软件(如 Photoshop、
ImageReady 和 Flash 等)制作的图形、动画和按钮
ACCP V4.08
Dreamweaver 概念
静 态网页:只能浏览,不能实现客户端和服务器端的交流互动
动 态网页,网站页面随用户的输入而变化,能与客户端交流互动
本地站点,一个在我们自己的计算机上,存储网站所有文件的临时文件夹
远程站点:位于 远程 Web 服务器上,与本地站点相对应
根 文件夹,用于存储网站文件的本地根目录
ACCP V4.09
Dreamweaver 工作区
Dreamweaver MX 2004 提供以下两种工作区布局可供选择:
设计者
代码编写者
ACCP V4.010
设计人员工作区
Dreamweaver 2004 MX 提供了一个集成所有面板和窗口的集成工作区文档窗口
“属性”检查器面板组
“插入”
选项卡
ACCP V4.011
“插入”栏
“插 入”栏中的按钮可用于将对象(如表格、图层和图形等)轻松插入 HTML 页面中
“插入”栏的“常用”选项卡中的按钮可用于插入最常用的对象,如链接、表格、图像、水平线等
ACCP V4.012
属性检查器
帮助编辑当前选择的页面元素属性
演示“属性检查器“的简单用法设置字体大小对齐文本设置字体颜色设置默认字体 设置链接 扩展箭头指针
ACCP V4.013
面板
组合常用功能、方便用户操作
演示面板的简单用法
“文件”面板
ACCP V4.014
面板组
组合在一组标题下的多组相关面板
例如,“文件”面板包含以下两个组
文件
资源
ACCP V4.015
“页面属性”对话框
“页面属性”对话框允许网页设计人员调整页面设置,如标题、颜色和页边距等
演示”页面属性对话框“的简单用法
ACCP V4.016
创建网站步骤:
选择新建站点,然后为其命名
选择服务器技术(如果适用)
选择在本地计算机上编辑本地副本的选项
选择用于存储网站文件的文件夹
选择连接到远程服务器的选项演示:在 Dreamweaver MX 2004 中创建网站
ACCP V4.017
制作网页演示:在 Dreamweaver MX 2004 中制作网页步骤:
在面板组中选择站点,然后新建一个文件
重命名该文件并将其打开
为页面指定一个标题
在页面上键入文本或插入图像
保存页面
ACCP V4.018
超级链接简介
文档的任何部分(如文本、页面、表单、动画或图像等)都可用作超级链接
超 级链接可用于指向页面的特定部分或网站的不同页面
有三种类型的链接路径:
绝对路径(例如 http://www.sohu.com/index.html)
文档相对路径(例如 adver/contents.html)
站点根目录相对路径(例如
/support/app/customer.html,其中,/”表示根目录)
ACCP V4.019
链接路径 2-1
相对路径
这些链接指向您的网站内部的网页
这些链接是相对于文档或根文件夹而言的,因此不需要一个像
http://www.sohu.com/index.html 一样的完整地址
绝对路径
这些链接指向您没有编辑控制权的站点。
此类链接用于为读者提供附加资源。
如友情链接:
Microsoft产品惠普产品
Sun技术
ACCP V4.020
链接路径 2-2
文档相对链接
birthdaysalbum/second.html
Root
folder
Photo
album
WWW
schoolalbum.html
Birthday
album
根文件夹相对链接
/photoalbum/birthdaysalbum/second.html
绝对链接
http://www.mypersonalsite.com/photoalbu
m/birthdaysalbum/second.html
Index.html
second.html
ACCP V4.021
创建超级链接
Dreamweaver 帮助您将页面元素(如文本、图像和按钮等)链接到其他文档(如 HTML 文件、图像和视频等)
链接可以建立在同一站点的各文档中,也可以建立在站点外的文档中

……….

….
…..
....

….

…..

…..

….

…..

…..
ACCP V4.022
链接到其他文档演示:链接到其他文档所包含的步骤步骤:
选择将用作链接的页面元素
选择链接应打开的文件
选择到达所链接文档的路径
选择应打开文档的位置
ACCP V4.023
链接 URL
如果 URL 路径太长并且很难记住,有一种简单的方法可将其链接到文本或对象
1,在 Dreamweaver 中选择将要链接的文本或图像
2,在浏览器中打开该站点,然后从“地址”框中复制此链接
3,激活 Dreamweaver,在“属性”检查器的“链接”框中粘贴到达该文件的 URL 或路径
4,按下 Enter 键应用该链接从浏览器的“地址”
栏中粘贴的链接地址
ACCP V4.024
链接到同一文档的各部分
当一个网页的主题较多 或内容较长 时,可以在网页内建立多个标记点,将超链接 指向 这些标记点,使浏览者 能 快速找到要阅读的内容
这些标记点也就是 命名锚记,简称 锚
……..
比尔,盖茨简介
…………
………………
…………….
…………..
…………..
比尔 -盖茨是微软公司主席和首席软件设计师。
微软公司件、服务和互联网技术方面都是全球范围内的领导者 ….
ACCP V4.025
创建并链接命名锚记步骤:
打 开将要创建命名锚记的文档
在 窗口的“设计”视图中确定插入命名锚记的位置
插 入命名锚记
为锚记命名
在,属性”检查器中链接锚记演示,创建命名锚记
ACCP V4.026
链接到其他文档的特定位置
选择 将用作链接的文本和图像
将选定的文本 /图像与命名锚记链接起来演示:链接到命名锚记
ACCP V4.027
总结 2-1
Internet 是一种大型网络,是网络的网络
Dreamweaver MX 2004 是一种功能强大的网页编辑工具,可在所见即所得环境中灵活地制作网页
Dreamweaver 可在设计网页时在其中插入文本、
图像、动画、音频、视频和 Java Applet 等对象
在 Dreamweaver 工作区中,所有面板、工具栏和文档窗口都集成在一个程序窗口中,类似于大多数基于 Windows 的程序
ACCP V4.028
总结 2-2
定义站点是设计网站的第一步,在此将定义站点的根文件夹、服务器和站点名称
网页共有两种类型,即静态网页和动态网页
通常,链接的路径分为三种:
绝对路径
文档相对路径
站点根目录相对路径