dreamweaver第一课

第一部分：基础知识一、Dreamweaver 界面介绍二、文本的基本设置三、文本插入栏的使用四、建立超链接1．为文本添加链接和设置链接2．制作电子邮件链接3．下载链接五、插入图像⑴插入图片的两种方法（从设计视图和资源面板）、编辑图像⑵插入GIF透明图片⑶背景图像的设置⑷插入图像占位符⑸制作光标经过图像⑹插入图片（使用热区）⑺制作导航条六、插入Flash对象第二部分：网页布局表格⑴插入表格⑵表格标记<table></table> <tr></tr> <td></td>⑶选择表格①选择整个表格●把光标移到表格的左上角、上边框或下边框之外的附近区域●在表格中单击任意一个位置，然后单击该表格对应的<table>标记。

●在表格中单击任意一个位置，按下两次“Ctrl+A”②选择表格的行③选择表格的列④选择单元格⑷设置表格属性及格式化表格通过属性检查器来选择⑸编辑表格①在表格内移动②剪切、复制和粘贴表格③合并和拆分单元格执行菜单：命令 排序表格举例：制作一个文学页面一、使用表格布局页面1．插入1行1列的表格，如下图所示：2．设置表格边框颜色。

在标签选择器中单击<table>标签，然后在属性面板中设置边框颜色设置为“#999900”，并在“垂直”下拉列表中选择“顶端”。

如下图所示：3．插入4行1列的嵌套表格二。

将光标定位在表格一中，然后执行插入表格命令，如下图所示：在“属性”面板中将第二行和第四行的“背景颜色”设置为“#999900”。

4．插入1行2列嵌套表格三。

将表格二适当拉大后，在第三行单元格单击，在其“属性”面板“垂直”下拉列表中选择“顶端”选项。

然后执行插入表格，如下图所示：5.插入4行2列嵌套表格四。

将表格三适当拉大后，在左侧单元格中单元，然后执行插入表格，如下图所示：得到如下图所示的效果：5．插入2行1列嵌套表格五。

须放在来自点的根文件夹下网站页面布局
网页的构成 网页的基本内容通常包括：标题、标志、页眉、导航栏、 主内容区和页脚。
1. 标题是用来提示该页面内容的，通常显示在IE的标题栏。 是在页面属性中设置的。
2. 网站的标志：成功的网站标志有着独特的形象标识。 3. Banner(横幅广告）：大多数网站的创建者在此设置网
网页的制作浏览和修改
1. 网页文档的创建 在DR中进行编辑
2. 文档的保存 注意1.应将文档保存在站点文件夹中 2.一般只要建立了站点会默认存入站点文 件夹中
3. 网页的预览：需要在IE中 4. 网页文件的修改：需要在DR中 5. 关闭文档
视图方式
• 在Dreamweaver 中共有三种视图方式。 1. 代码 2. 设计 3. 代码和设计 • 它们之间的切换可以利用“查看”/…
• 将汉字的输入方式设制为全角方式，按SPACE键便 可连续输入空格。
• 用与背景颜色相同的字符来完成空格的输入。
分段与分行
• 回车是段落的结束标记，当需要分段时， 只需要回车就可以。
• 如果只需要换行而不分段，则需要同时 按下SHIFT+ENTER
• 段落间的距离要比行距大。 • 在HTML语言的标记中，分段为<p></p>
件夹）
站点规划要点
1. 用分级文件夹来保存文档 2. 使用合理的文件名 文件名要直观 3. 合理配置文档中的资源 4. 将本地站点和远程站点设置为同样的结
构 5. 整个站点要有一个整体的风格
设计站点和网页的注意事项
• 在网页设计中，不能使用中文作为文件 或文件夹名
• 网页中的文件命名区分大小写 • 每个网站都必须有一个主页 • 主页文件一般以index.htm文件名而且必

第1章体验Dreamweaver 8梦幻境界Dreamweaver 8是Macromedia公司最新推出的一个功能强大的网页制作工具。

与Dreamweaver MX 2004相比，其功能有很多改进和增强。

本章将带你进入Dreamweaver 8所构建的梦幻世界。

本章首先要介绍网站开发的基础知识，然后讲述Dreamweaver 8的新增功能、编辑环境以及面板等内容。

本章学习要点：了解网站及开发技术的基础知识认识Dreamweaver 8的新增功能熟悉Dreamweaver 8的编辑环境初步认识Dreamweaver 8的面板2Dreamweaver 8网页制作与网站开发标准教程1.1 Internet与Web基础知识Internet是一个全球性的计算机互联网络，它是将不同地区而且规模大小不一的网络互相连接而成。

所有人都可以通过网络的连接来共享和使用Internet中各种各样的信息。

随着Internet的快速发展，它已经深刻地影响和改变着我们的生活和世界。

1.1.1 万维网和浏览器1.1.2 IP地址和域名表1-1机构域名表1.1.3 统一资源定位器（URL）1.2 网站开发技术简介网站开发人员必须掌握一定的Web开发技术和相应的开发工具才能“构造”出真正的Web网站。

本节就一些常用的网站开发技术做一个简单的介绍，让我们在开发网站之前先对该领域的开发工具有一个大致地了解。

1.2.1 HTML第1章第1章体验Dreamweaver 8梦幻境界31.2.2 CSS1.2.3 ASP1.2.4 PHP1.2.5 JSP1.3 Dreamweaver 8新增功能网页制作爱好者都翘首以盼的Dreamweaver 8终于问世了，它增加了许多新特性，在原来的Dreamweaver MX 2004的基础上，更加凸现了功能灵活而又强大的作风。

1.3.1 Dreamweaver发展简介1.3.2 缩放、手形、选取工具1.3.3 辅助线工具1.3.4 扩展的CSS支持4Dreamweaver 8网页制作与网站开发标准教程1.3.5 代码折叠1.3.6 其他新功能1.4 Dreamweaver 8工作环境第1次使用Dreamweaver 8时，可以执行【开始】|【程序】|Macromedia|Macromedia Dreamweaver 8命令启动Dreamweaver 8。

学习目的
通过本章的学习，您可以：
Dreamweaver CS5的新增功能。 工作界面的构成及各菜单栏、工具栏、插入栏和浮动面板的功能与作用。 文件的打开、创建和存储的基本方法。
1.1 Dreamweaver CS5的新功能
集成CMS支持 CSS 检查 启用/禁用CSS 集成Adobe BrowserLab PHP 自定义类代码提示 站点特定的代码提示 与 Business Catalyst 集成 增强的CSS起始布局 增强的Subversion支持 简化的站点设置 保持跨媒体一致性 动态相关文件
第1章 网页制作基础知识
本章重点
本 章 介 绍 Dreamweaver CS5 中 文 版 的 基 础 知 识 ， 内 容 包 括 ： Dreamweaver CS5的新增功能和安装，简单介绍其用户界面以及创建与保存 文件的方法等。Dreamweaver CS5是著名影像处理软件公司Adobe推出的最 新网页设计制作工具，是继Dreamweaver CS5之后的升级版本，是目前最完 美的网站制作工具。
1.2.6 浮动面板
在Dreamweaver CS5工作环境的右侧存在着浮动面板。浮动面板中包括了“CSS 样式”面板、“AP元素”面板、“代码片段”面板、“参考”面板、“数据库”面 板、“绑定”面板、“服务器行为”面板、“组件”面板、“属性”面板、“行为” 面板、“历史记录”面板、“框架”面板、“标签检查器”面板、“文件”面板和 “资源”面板等。
1.2.1 菜单栏 1.2.2 文档工具栏 1.2.3 “插入”面板
1.2.4 文档窗口
设计视图 代码视图 拆分视图（垂直拆分/水平拆分）
1.2.5 属性面板
属性面板分成上下两部分。不同的对象有不同的属性，因此选中不同对象 时，属性面板显示的内容是不相同的。单击面板右下角的三角形按钮可以关闭 属性面板的下部分。