第3章 Dreamweaver CS6创建基本文本网页
合集下载
中文版 Dreamweaver CS6网页设计教程 第3章
22
3.6 认识超链接
在创建超链接之前，首先得清楚文档的链接路径。概 括起来，文档的链接路径主要有绝对路径、相对路径、 根目录相对路径等三种形式。
绝对路径：一般指服务器上的文件，是完整的文件路径，包含 其应用协议，例如/daquan/intro.htm。 相对路径：本地站点内常用的文件路径，如果文件都在同一个 目录中，使用相对路径则极为有效。如果要链接同一文件夹中 的文档，则只需要输入文件名，例如cursor.htm；如果要链接 同一目录下其他子文件夹中的文档，则需要输入文件夹名称和 斜杠(/)，然后输入文件名，例如document/cursor.htm；如果要 链接上一层文件夹中的文档，则需要在文件名称前面添加../， 例如../cursor.htm。 根目录相对路径：使用多个服务器的大型站点会用到这种文档 路径，而对于一般的Web站点没有必要在页面中插入文本内容，一般可以通过以下两 种方式来进行：一种是在网页编辑窗口中直接 用键盘输入文本，这是文字输入最基本的方式。 另一种是复制文本的方式，如果需要插入其他 文档中或是网站页面中的文本，可以直接使用 “复制”功能，将大段的文本内容复制到网页 的编辑窗口来进行排版的工作，如图3-1所示。
30
3.8.1 添加链接
如果要添加超链接，则可使用下面的操作步骤。 (1) 在站点管理窗口中单击选定文件，在其左上角出现 图标。 (2) 执行下列操作之一可添加链接。
23
3.7 创建超链接
网页中的链接形态多种多样，根据 链接对象的不同，可将其分为文本 链接、图像链接、邮件链接、锚点 链接。此外，还有图像映射、空链 接、脚本链接等几种链接形式。本 节中对这些链接的创建方法进行介 绍。
24
3.7.1 创建文本链接
Dreamweaver cs6入门与提高实例教程课件Dreamweaver cs6入门与提高实例教程课件第3章网站的构建与管理
同步文件
同步预览
3.6 实例制作之将已有文件组织为站点
本节将这些已有的文件夹组织为一个站点。步骤如下： （1）启动Dreamweaver CS6，执行“站点”/“新建站点”命令，打开站点设置对 话框。 （2）在“站点名称”后面的对话框中输入站点名称blog。 （3）单击“本地站点文件夹”右侧的文件夹图标，浏览到 c:\inetpub\wwwroot\blog\目录；或直接输入c:\inetpub\wwwroot\blog\。
展开的“文件”面板选项
3.3.3 操作站点文件或文件夹
无论是创建空白的文档，还是利用已有的文档构建站点，都可能会需要对站 点中的文件夹或文件进行操作。下面简要介绍利用“文件”面板对本地站点的文 件夹和文件进行创建、删除、移动和复制等操作。
移动文件/文件夹
更新文件链接
注意：同删除站点的操作不同，这种对文件或文件夹的删除操作，会从磁盘上真正 删除相应的文件或文件夹。
本地站点和远程web站点应该具有完全相同的结构，在这两种站点之间传输 文件时，如果站点中不存在必需的文件夹，则Dreamweaver将自动创建这些文件 夹。如果使用Dreamweaver创建本地站点，然后将全部内容上传到远程站点，则 Dreamweaver能确保在远程站点中精确复制本地结构。
站点的发布是一个持续的过程，这一过程的一个重要部分是定义并实现一个 版本控制系统，既可以使用Subversion，也可以使用外部的版本控制应用程序。
显示本地和远端站点
Dreamweaver CS6改善了 FTP 性能。利用对 jQuery Mobile 和 Adobe PhoneGap™ 框架的更新支持，可以便捷地建立移动应用程序。利用重新改良的 多线程 FTP 传输工具和图像编辑功能，可以有效地设计、开发并发布网站和移动 应用程序，节省上传大型文件的时间。
同步预览
3.6 实例制作之将已有文件组织为站点
本节将这些已有的文件夹组织为一个站点。步骤如下： （1）启动Dreamweaver CS6，执行“站点”/“新建站点”命令，打开站点设置对 话框。 （2）在“站点名称”后面的对话框中输入站点名称blog。 （3）单击“本地站点文件夹”右侧的文件夹图标，浏览到 c:\inetpub\wwwroot\blog\目录；或直接输入c:\inetpub\wwwroot\blog\。
展开的“文件”面板选项
3.3.3 操作站点文件或文件夹
无论是创建空白的文档，还是利用已有的文档构建站点，都可能会需要对站 点中的文件夹或文件进行操作。下面简要介绍利用“文件”面板对本地站点的文 件夹和文件进行创建、删除、移动和复制等操作。
移动文件/文件夹
更新文件链接
注意：同删除站点的操作不同，这种对文件或文件夹的删除操作，会从磁盘上真正 删除相应的文件或文件夹。
本地站点和远程web站点应该具有完全相同的结构，在这两种站点之间传输 文件时，如果站点中不存在必需的文件夹，则Dreamweaver将自动创建这些文件 夹。如果使用Dreamweaver创建本地站点，然后将全部内容上传到远程站点，则 Dreamweaver能确保在远程站点中精确复制本地结构。
站点的发布是一个持续的过程，这一过程的一个重要部分是定义并实现一个 版本控制系统，既可以使用Subversion，也可以使用外部的版本控制应用程序。
显示本地和远端站点
Dreamweaver CS6改善了 FTP 性能。利用对 jQuery Mobile 和 Adobe PhoneGap™ 框架的更新支持，可以便捷地建立移动应用程序。利用重新改良的 多线程 FTP 传输工具和图像编辑功能，可以有效地设计、开发并发布网站和移动 应用程序，节省上传大型文件的时间。
【设计】中文版DreamweaverCS6网页设计教程IT168文库
【关键字】设计第1章Dreamweaver CS6简介Dreamweaver CS6是一款功能强大的可视化的网页编辑与管理软件。
利用它，不仅可以轻松地创建跨平台和跨浏览器的页面，也可以直接创建具有动态效果的网页而不用自己编写源代码。
Dreamweaver CS6 最主要的优势在于能够进行多任务工作，并且在操作方法、界面风格方面更加人性化。
用户可以根据自己的喜好和工作方式，重新排列面板和面板组，自定义工作区。
本章主要内容●Dreamweaver CS6的新增功能。
●Dreamweaver CS6的安装、删除和启动。
●Dreamweaver CS6的工作界面。
●Dreamweaver CS6的一般操作。
本章重点●Dreamweaver CS6常用面板的使用方法。
●Dreamweaver CS6的文件操作。
1.1 Dreamweaver CS6概述Dreamweaver CS6 是世界顶级厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动的软件。
在业界通常将Dreamweaver、Flash、Fireworks称为“网页三剑客”。
由于它支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，因此对于初级人员，无须编写任何代码就能快速创建Web页面。
其成熟的代码编辑工具更适用于Web开发高级人员的创作。
CS6新版本使用了版面创建页面，在发布前可使用多预览审阅设计,大大提高了用户的工作效率，而改善的FTP性能可更高效地传输大型文件。
“实时视图”和“多屏幕预览”面板可呈现HTML5 代码，用户能更方便地检查自己的工作。
1.2 Dreamweaver CS6的新增功能相对于以前的版本，Dreamweaver CS6的功能主要在以下方面进行了增强。
1. 可响应的自适应网格版面使用响应迅速的CSS 版面，可以创建跨平台和跨的兼容。
利用简洁、业界标准的代码可为各种不同设备和计算机开发项目，提高工作效率。
第3章用文本和图像充实网页 中文版Dreamweaver CS6网页制作课件
Dreamweaver CS6 从入门到精通
第3章 用文本和图像充实网页
·清华大学出版社 ·
中文版Dreamweaver CS6网页制作从入门到精通
本章导读
1 添加文本 2 设置文本格式 3 创建列表
Conte4n为ts网页添加图像
5 图像的设置和应用
从入门到精通
清华大学出版社
2
Dreamweaver CS6 从入门到精通
入”面板，在“常用”下拉列表中选择“文本”
选项切换到“文本”插入栏，在插入列表中单击
“已编排格式”按钮 ，然后在文档中连续按空格
键即可。
从入门到精通
清华大学出版社
8
中文版Dreamweaver CS6网页制作从入门到精通
3.1.3 添加水平线
水平线对于信息的组织很有用。在页面中，可以 使用一条或多条水平线以可视方式分隔文本和对 象，使段落区分更明显，让网页更具层次感。
GIF：图像交换格式。GIF图像是第一个在网页中应用的图像 格式，通常用作站点Logo、广告条Banner及网页背景图像等。 其优点是它可以使图像文件变得相当小，也可以在网页中以 透明方式显示，并可以包含动态信息。 JPG：联合照片专家组（Join Photograph Graphics），也 称为JPEG。这种格式的图像可以高效地压缩，图像文件变小 的同时基本不失真，因为其丢失的内容是人眼不易察觉的部 分，因此常用来显示颜色丰富的精美图像，如照片等。 PNG：便携网络图像（Portable Network Graphics），既 有GIF能透明显示的特点，又具有JPEG处理精美图像的优势， 常常用于制作网页效果图。
清华大学出版社
14
中文版Dreamweaver CS6网页制作从入门到精通
第3章 用文本和图像充实网页
·清华大学出版社 ·
中文版Dreamweaver CS6网页制作从入门到精通
本章导读
1 添加文本 2 设置文本格式 3 创建列表
Conte4n为ts网页添加图像
5 图像的设置和应用
从入门到精通
清华大学出版社
2
Dreamweaver CS6 从入门到精通
入”面板，在“常用”下拉列表中选择“文本”
选项切换到“文本”插入栏，在插入列表中单击
“已编排格式”按钮 ，然后在文档中连续按空格
键即可。
从入门到精通
清华大学出版社
8
中文版Dreamweaver CS6网页制作从入门到精通
3.1.3 添加水平线
水平线对于信息的组织很有用。在页面中，可以 使用一条或多条水平线以可视方式分隔文本和对 象，使段落区分更明显，让网页更具层次感。
GIF：图像交换格式。GIF图像是第一个在网页中应用的图像 格式，通常用作站点Logo、广告条Banner及网页背景图像等。 其优点是它可以使图像文件变得相当小，也可以在网页中以 透明方式显示，并可以包含动态信息。 JPG：联合照片专家组（Join Photograph Graphics），也 称为JPEG。这种格式的图像可以高效地压缩，图像文件变小 的同时基本不失真，因为其丢失的内容是人眼不易察觉的部 分，因此常用来显示颜色丰富的精美图像，如照片等。 PNG：便携网络图像（Portable Network Graphics），既 有GIF能透明显示的特点，又具有JPEG处理精美图像的优势， 常常用于制作网页效果图。
清华大学出版社
14
中文版Dreamweaver CS6网页制作从入门到精通
DW第3章 Dreamweaver CC创建基本文本网页
3.5.1 设置META
META 对象常用于插入一些为 Web 服务器提供选 项的标记符，方法是通过 http-equiv 属性和其他 各种在Web页面中包括的、不会使浏览者看到的 数据。
3.5.2 插入关键字
关键字也就是与网页的主题内容相关的简短而 有代表性的词汇，这是给网络中的搜索引擎准 备的。关键字一般要尽可能地概括网页内容， 这样浏览者只要输入很少的关键字，就能最大 程度地搜索网页。
3.4.1 设置文本字体
选择一种合适的字体，是决定网页美观、布局 合理的关键，在【属性】面板中单击【字体】 右边的文本框，在弹出的下拉列表中选择要设 置的字体，具体操作步骤如下 。
3.4.2 设置字体大小
选中要设置字号的文本，在【属性】面板中的 【大小】下拉列表中选择字号的大小，或者直 接在文本框中输入相应大小的字号。
3.1.5
插入栏
【插入】栏有两种显示方式：一种 是以菜单方式显示，另一种是以制 表符方式显示。【插入】栏中放置 的是制作网页的过程中经常用到的 对象和工具，通过【插入】栏可以 很方便地插入网页对象。【插入】 栏中包含用于创建和插入对象（例 如表格、图像和链接）的按钮。这 些按钮按几个类别进行组织，可以 通过从【类别】弹出菜单中选择所 需类别来进行切换 。
教学重点 Dreamweaver CC工作环境 创建站点 添加文本元素 编辑文本格式 设置头信息 创建基本文本网页
3.1
Dreamweaver CC工作环境
Dreamweaver CC的工作界面主要由菜单栏、 文档窗口、属性面板以及多个浮动面板组成， 如图3-1所示。
3.2.1
使用向导建立站点
用Dreamweaver制作网页的基本步骤
用Dreamweaver制作网页的基本步骤
关于用Dreamweaver制作网页的基本步骤
1、在Dreamveaver“文件-新建-常规-基本页-HTML”，这样就建好了一个页面，英文版的默认的文件名为untitled.htm。
中文版的.的默认的文件名为“无标题文档”。
htm就表示这个网页文件是一个静态的HTML文件。
给它改名为index.htm。
注：网站第一页的名字通常是index.htm或index.html。
其它页面的名字可以自己取。
这也就是主页，上传后打开网页默认连接到此页。
2、在标题空格里输入网页名称，点击修改-页面属性，打开“页面属性”窗口。
在这里可以设置网站的标题、背景颜色或背景图像，超级链接的颜色(一般默认即可)，其他都保持默认即可。
3.此时光标位于左上角，可输入一句话，如“欢迎来到我的主页”。
选取文字，用菜单“窗口/属性”打开属性面板，选取文字大小为6，再使文字居中，然后在文字前用几个回车使其位于页面中间等。
4.如要选取字体，则选择字体中的最后一项：编辑字体列表。
然后在对话框中选+号，接着在“可用字体”栏中选择需要加入到字体列表中的一种字体，点击中间的按钮就可以加入了。
下载全文。
Dreamweaver_CS6完美网页制作基础、实例与技巧从入门到精通课件第3章 网页的网布局设计
网页中中文默认的标准字体是“宋体”，英文是 The New Roman。如果在网页中没有设置任何 字体，在浏览器中将以这两种字体显示。
3.4.2
文字的颜色
在网页设计中可以为文字、文字链接、已访问链 接和当前活动链接选用各种颜色。如正常字体颜 色为黑色，默认的链接颜色为蓝色，鼠标点击之 后又变为紫红色。
3.2
网页布局方法
在制作网页前，可以先布局出网页的草图。网页 布局的方法有两种，一种为纸上布局，另一种为 软件布局，下面分别进行介绍。
3.2.1
纸上布局法
设计版面布局前先画出版面的布局草图，接着对版 面布局进行细划和调整，反复细划和调整后确定最 终的布局方案。
3.2.2
软件布局法
如果不喜欢用纸来画出布局示意图，那么还可以 利用Photoshop、Fireworks等软件来完成这些 工作。
3.4.3
文字的图形化
所谓文字的图形化，即把文字作为图形元素来表 现，同时又强化了原有的功能。作为网页设计者， 既可以按照常规的方式来设置字体，也可以对字 体进行艺术化的设计。
3.5
图像与版式设计
图像是网页构成中最重要的元素之一，美观的图 像会给网页增色不少。另一方面，图像本身也是 传达信息的重要手段之一，与文字相比，它可以 更直观更容易地把那些文字无法表达的信息表达 出来，易于浏览者理解和接受，所以图像在网页 中非常重要。
3.5.1
图像的设计流程
网页中的图像文件由若干部分组成，可以将图像 的不同部分理解为部件。设计人员了解了图像中 需要设计的部件后，才能考虑其如何设计。
3.5.2
网页中应用图像的注意要点
网页设计与制作第3章 设置页面和文本
3.3.2
文档标题
Dreamweaver提供了6种标题格式：标题1～标题6，可以在【属性 （HTML）】面板的【格式】下拉列表中进行选择。设置文档标题的 6种 HTML标签依次是：<h1>…</h1>，<h2>…</h2>，<h3>…</h3>， <h4>…</h4>，<h5>…</h5>，<h6>…</h6>。数字越小字号越大，数字 越大字号越小。
3.1.5
添加内容
在网页文档中，可以通过键盘直接输入文本，也可以将其他文档中 的内容导入或复制/粘贴到当前网页文档中，对于一些无法输入的特殊字 符还可以通过Dreamweaver CS6中的相关命令插入到文档中。 一、复制/粘贴文本 使用复制/粘贴的方法从其他文档中复制/粘贴文本，此时 Dreamweaver CS6将按【首选参数】对话框的【复制/粘贴】分类选项的 格式设置进行粘贴文本。如果选择菜单命令【编辑】/【选择性粘贴】， 将打开【选择性粘贴】对话框，可以根据需要选择相应的选项进行粘贴 文本。
3.1.3 打开文档
在Dreamweaver CS6中，可通过【文件】面板和菜单命令两种 方式来打开网页文档。
3.1.4 关闭文档
在Dreamweaver CS6中，可通过文档标签和菜单命令两 种方式来关闭网页文档。选择菜单命令【文件】/【关
闭】，可关闭当前打开的文档。选择菜单命令【文件】 /【全部关闭】，可关闭所有打开的文档。
3.3.3
字体类型
通过【属性（CSS）】面板中的【字体】下拉列表可以设置所选文本 的字体类型。
3.3.4
字体颜色
Dreamweaver CS6网页设计案例教程(微课版)
读书笔记
读书笔记
这是《Dreamweaver CS6网页设计案例教程（微课版）》的读书笔记模板，可以替换为自己的心得。
精彩摘录
精彩摘录
这是《Dreamweaver CS6网页设计案例教程（微课版）》的读书笔记模板，可以替换为自己的精彩内容摘录。
作者介绍
同名作者介绍
这是《Dreamweaver CS6网页设计案例教程（微课版）》的读书笔记模板，暂无该书作者的介绍。
第10章表单与行为
10.1废品回收页 10.2卫浴页 10.3综合演练——问卷调查页 10.4综合演练——全麦面包页
第11章页代码
11.1设计无忧页 11.2油画艺术馆页 11.3综合演练——机电设备页 11.4综合演练——自行车页
第12章综合设计实训
12.1个人页——张美丽的个人页 12.2游戏娱乐页——娱乐星闻页 12.3旅游休闲页——篮球运动页 12.4房产页——焦点房产页 12.5文化艺术页——书法艺术页
1.1操作界面 1.2创建站框架 1.3管理站点 1.4页文件头设置
第2章文本与文档
2.1轩宇门窗页 2.2休闲旅游页 2.3休闲度假页 2.4综合演练——家居装饰页 2.5综合演练——有机果蔬页 3.1咖啡馆页
第3章图像和多媒体
3.2物流运输页 3.3综合演练——儿童零食页 3.4综合演练——房源页
目录分析
1
文前
2
内容提要
3 第1章初识
Dreamweaver CS6
4
第2章文本与文 档
5
第3章图像和多 媒体
1
第4章超链接
2
第5章使用表格
3
第6章使用框架
4
第7章使用层
Dreamweaver-CS6网页制作第3章
目录
前进
后退
结束
3.2使用Div+CSS制作模板
至此，5个Div标签添加完毕，其中div0是其他4个Div标签的容器， 由于已经删掉了其中的文本内容，所以div0在“设计”视图中看不 到，如下图所示
目录
前进
后退
结束 插入全部Div标签效果图
3.2使用Div+CSS制作模板
步骤五 在Div内添加内容
目录
前进
后退
结束 “插入Div标签对话框”
3.2使用Div+CSS制作模板
（5）在div0中的div2下方添加div3。插入Div标签，在“插入”下 拉列表框中选择“在标签之后”“<div id=“div2”>”,“ID”组 合框中输入“div3” ，新建#div3的CSS规则：“方框”属性中宽 度为1000像素。 （6）在div0中的div3下方添加div4。插入Div标签，在“插入”下 拉列表框中选择“在标签之后”“<div id=“div3”>”,“ID”组 合框中输入“div4” ，新建#div4的CSS规则：在“类型”分类中 设置文字大小为14像素；在“区块”分类中设置对齐为居中； “方 框”分类属性中宽度为1000像素，高度设为28像素，上填充为10 像素，下、左、右填充均为0。
前进
后退
结束 “新建文档”对话框
3.2使用Div+CSS制作模板
（2）单击“创建”按钮，新建一个空白模板页面。单 击“文件”������ 所示： “保存”菜单项，弹出对话框，如下图
目录
前进
后退
提示对话框 结束
3.2使用Div+CSS制作模板
（3）单击“确认”按钮，打开“另存模板”对话框，选中“悠悠 我心的个人网站”站点，在“另存为”文本框中输入模板名称 “modle”，如下图所示，单击“保存”按钮，保存模板。此时 “文件”面板中增加了一个templates文件夹，其中有一个模板文 件model.dwt。
前进
后退
结束
3.2使用Div+CSS制作模板
至此，5个Div标签添加完毕，其中div0是其他4个Div标签的容器， 由于已经删掉了其中的文本内容，所以div0在“设计”视图中看不 到，如下图所示
目录
前进
后退
结束 插入全部Div标签效果图
3.2使用Div+CSS制作模板
步骤五 在Div内添加内容
目录
前进
后退
结束 “插入Div标签对话框”
3.2使用Div+CSS制作模板
（5）在div0中的div2下方添加div3。插入Div标签，在“插入”下 拉列表框中选择“在标签之后”“<div id=“div2”>”,“ID”组 合框中输入“div3” ，新建#div3的CSS规则：“方框”属性中宽 度为1000像素。 （6）在div0中的div3下方添加div4。插入Div标签，在“插入”下 拉列表框中选择“在标签之后”“<div id=“div3”>”,“ID”组 合框中输入“div4” ，新建#div4的CSS规则：在“类型”分类中 设置文字大小为14像素；在“区块”分类中设置对齐为居中； “方 框”分类属性中宽度为1000像素，高度设为28像素，上填充为10 像素，下、左、右填充均为0。
前进
后退
结束 “新建文档”对话框
3.2使用Div+CSS制作模板
（2）单击“创建”按钮，新建一个空白模板页面。单 击“文件”������ 所示： “保存”菜单项，弹出对话框，如下图
目录
前进
后退
提示对话框 结束
3.2使用Div+CSS制作模板
（3）单击“确认”按钮，打开“另存模板”对话框，选中“悠悠 我心的个人网站”站点，在“另存为”文本框中输入模板名称 “modle”，如下图所示，单击“保存”按钮，保存模板。此时 “文件”面板中增加了一个templates文件夹，其中有一个模板文 件model.dwt。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
3.5.3 插入说明
插入说明的具体操作步骤如下。
3.5.4 插入刷新
设置网页的自动刷新特性，使其在浏览器中显示 时，每隔一段指定的时间，就跳转到某个页面或 是刷新自身。
3.6 实战演练——创建基本文本网页
本章主要讲述了Dreamweaver CS6的操作界面、 在网页中插入文本和设置文本属性等，下面通过 以上所学的知识讲述如何创建基本文本网页，效 果如图3.47所示。
3.2.1 使用向导建立站点
Dreamweaver是最佳的站点创建和管理工 具，使用它可以创建完整的站点。创建本 地站点的具体操作步骤如下。
3.2.2 使用高级设置建立站点
要对已经建立的站点进行进一步设置，可完善站 点设置。选择菜单中【站点】|【管理站点】命令， 弹出【管理站点】对话框，在对话框中选择站点。
3.1.5 插入栏
插入栏中放置的是编 写网页的过程中经常 用到的对象和工具， 通过该面板可以很方 便地使用网页中所需 的对象以及对对象进 行编辑所要用到的工 具，如图3.6所示。
3.2
创建站点
在使用Dreamweaver制作网页前，最好先定义一 个站点，这是为了更好地利用站点对文件进行管 理，尽可能地减少错误，如路径出错、链接出错 等。
3.4.2 设置文本大小
选择一种合适的字体，是决定网页美观、布局合 理的关键，在设置网页时，应对文本设置相应的 字号。
3.4.3 设置文本颜色
还可以改变网页文本的颜色，设置文本颜色的具 体操作步骤如下。
3.5 设置头信息
文件头标签也就是通常说的<meta>标签，文件头 标签在网页中是看不到的，它包含在网页中的 <head>...</head>标签之间。所有包含在该标签 之间的内容在网页中都是不可见的。
3.3.3 插入特殊字符
特殊字符包含换行符、不换行空格、版权信息和 注册商标等，它是网页中经常用到的元素之一。
3.3.4
插入水平线
水平线在网页文档中经常用到，它主要用于分隔 文档内容，使文档结构清晰明了，合理使用水平 线可以获得非常好的效果。一篇内容繁杂的文档， 如果合理放置水平线，会变得层次分明、易于阅 读。
3.4 编辑文本格式
Dreamweaver中的文本格式设置与使用标准字处 理程序类似。可以为文本块设置默认格式设置样 式（段落、标题 1、标题 2 等）、更改所选文本 的字体、大小、颜色和对齐方式，或者应用文本 样式（如粗体、斜体、代码和下划线）。
3.4.1 设置文本字体
输入文本后，可以在【属性】面板中对文本的大 小、字体和颜色等进行设置。设置文本属性的具 体操作步骤如下。
第3章 Dreamweaver CS6创建基 本文本网页
教学内容：Dreamweaver CS6是业界领先的Web 开发工具，使用该工具可以高效地设计、开发 和维护网站。
• • • • •
教学重点 Dreamweaver CS6工作环境 掌握创建站点 掌握添加文本元素 掌握编辑文本格式 掌握设置头信息
3.5.1 设置META
META对象常用于插入一些为Web服务器提供选项 的标记符，方法是通过http-equiv属性和其他各种 在Web页面中包括的、不会使浏览者看到的数据。 设置META的具体操作步骤如下。
3.5.2 插入关键字
ห้องสมุดไป่ตู้
关键字也就是与网页的主题内容相关的简短而有 代表性的词汇，这是给网络中的搜索引擎准备的。
3.1.3 属性面板
【属性】面板主要用于查看和更改所选对象的各 种属性，每种对象都具有不同的属性。在【属性】 面板包括两种选项，一种是【HTML】选项，如图 3.4所示。
3.1.4
面板组
在Dreamweaver工作界 面的右侧排列着一些浮 动面板，这些面板集中 了网页编辑和站点管理 过程中最常用的一些工 具按钮。
3.3 添加文本元素
文本是传递信息的基础，浏览网页内容时，大部 分时间是浏览网页中的文本，所以学会在网页中 创建文本至关重要。
3.3.1 在网页中添加文本
文本是基本的信息载体，是网页中最基本的 元素，在浏览网页时，获取信息最直接、最 直观的方法就是通过文本。
3.3.2 插入日期
在Dreamweaver中插入日期非常方便，它提供了 一个插入日期的快捷方式，用任意格式即可在文 档中插入当前时间，同时它还提供了日期更新选 项，当保存文件时，日期也随着更新。
菜单栏包括【文件】、【编辑】、【查 看】、【插入】、【修改】、【格式】、 【命令】、【站点】、【窗口】和【帮助】 10个菜单，如图3.2所示。
3.1.2 文档窗口 文档窗口主要用于文档的编辑，可同时打 开多个文档进行编辑，可以在【代码】视 图、【拆分】视图和【设计】视图中分别 查看文档，如图3.3所示。
3.1 Dreamweaver CS6工作环境
Dreamweaver与Flash、Fireworks这3者被用 户称为“网页设计三剑客”。Dreamweaver 的优势在于它不仅是优秀的所见即所得的 编辑软件，同时也兼顾了HTML源代码，可 以让用户很方便地在两种模式之间切换。
3.1.1 菜单栏