《Dreamweaver cs5中文版入门与提高实例教程第4章》由会员分享，可在线阅读，更多相关《Dreamweaver cs5中文版入门与提高实例教程第4章（17页珍藏版）》请在金锄头文库上搜索。
1、第4章 文本与超级链接,本章重点 本章将介绍文本与超级链接的基本知识及使用方法，内容包括：添加普通文本、插入特殊符号和插入日期的方法；对文本的格式设置；三种超级链接的概念与功能；创建各种超级链接的方法，包括使用属性面板创建链接、链接到文档中指定位置、创建指向E-mail地址超链接等。 学习目的 通过本章的学习，您可以掌握： 插入普通文本、特殊符号和日期的方法。 超级链接的基本知识和三种超级链接的区别。 创建超链接和设置超链接属性的方法。,4.1 添加网页文本,4.1.1 插入普通文本,1 直接在Dreamweaver的文档窗口光标所在位置输入文本内容。 2在其他的应用程序或文档中复制文本，然后
2、切换回Dreamweaver文档窗口，将光标插入到要放置文本的地方，再选择“编辑”/“粘贴”或“选择性粘贴”命令。 利用 Dreamweaver CS5的粘贴选项，可以保留所有源格式设置，也可以只粘贴文本，还可以指定粘贴文本的方式。 3使用“文件”/“导入”命令导入其他文档中的文本，如XML、表格式数据、word文档和Excel文档。 4 从支持文本拖放功能的应用程序中拖放文本到Dreamweaver CS5的文档窗口。,4.1.2 插入特殊字符,在HTML中，一个特殊字符有两种表达方式，一种称作数字参考，另一种称作实体参考。 所谓数字参考，就是用数字来表示文档中的特殊字符，通常由前缀“”组成
3、。其表达方式为：&name；，其中name是一个用于表示字符的名称，且区分大小写。,打开“插入”面板，切换到“文本”插入面板，然后单击“字符：其他字符”图标右下角的下拉箭头，就可以看到Dreamweaver自带的常用特殊字符，如图所示。 如果在下拉菜单中没有找到需要的特殊字符，则单击下拉菜单中的“其他字符”按钮，打开“插入其他字符”对话框，即可查看其他特殊字符。如图4-11所示。,4.1.3 查找和替换文本,执行“编辑”“查找和替换”打开“查找和替换”对话框，如图所示。,注意：按Ctrl+Enter键或Shift+Enter键（Windows）或者按Control+Return键、Shift+
4、Return 键或Command+Return键（Macintosh）可以在文本搜索字段中添加换行符，从而搜索回车符。执行此类搜索时，如果不使用正则表达式，则请取消选择“忽略空白”选项。此搜索专门查找回车符，而不是仅查找换行符匹配项；例如，它不查找标签或标签。回车符在“设计”视图中显示为空格而不是换行符。,4.1.4 插入日期,Dreamweaver CS5为读者提供了插入日期的功能，使用它可以用任意格式在文档中插入当前时间，同时日期自动更新。,提示：“插入日期”对话框中显示的日期和时间不是当前日期，也不反映访问者在查看站点时所看到的日期/时间。它们只是说明此信息的显示方式的示例。,4.2.1
5、 设置文本属性,文本的大部分格式设置都可以通过属性设置面板实现。 执行“窗口”/“属性”命令，即可打开属性设置面板，如图所示。,单击属性面板左上角的CSS按钮，即可使用CSS规则格式化文本，如图所示。,注意： “字体”、“大小”、“文本颜色”、“粗体”、“斜体”和“对齐”属性始终显示应用于“文档”窗口中当前所选内容的规则的属性。在更改其中的任何属性时，将会影响目标规则。,4.2 设置文本格式,4.2.2 设置段落格式,使用属性面板中的“格式”弹出菜单或“文本”“段落格式”子菜单可以应用标准段落和标题标签。对段落应用标题标签时，Dreamweaver自动添加下一行文本作为标准段落。若要更改此设置
6、，请执行“编辑”“首选参数”命令，然后在“常规”类别中的“编辑选项”下确保取消选中“标题后切换到普通段落”，如图所示。,4.3 用CSS样式格式化文本,将插入点放在文档中。然后在CSS样式面板中，单击面板右下角区域中的新建CSS样式按钮。 在弹出的 “新建CSS规则”对话框中选择CSS样式表的类型。,4.3.1 创建CSS样式表,4.3.2 链接外部CSS表,所谓外部CSS样式表，指的是一个包含样式和格式规范的外部文本文件。对一个外部CSS 样式表进行编辑后，所有同该 CSS 样式表链接的文档都会根据所作的修改自动进行更新。,在“CSS样式”面板中，单击 按钮，弹出 “链接外部样式表”对话框。
7、,如果选择“导入”，会将外部CSS样式表的信息包含进当前文档，而“链接”选项只读取和传送信息，不会载入样式信息。虽然“导入”和“链接”都可以将外部CSS样式表中的所有样式调用到当前文档中，但“链接”可以提供更多的功能，适用的浏览器也更多。,4.3.3 修改CSS样式,Dreamweaver CS5提供了多种方式对样式表进行管理。如果要编辑某个样式表，请执行以下操作之一： 单击文本属性面板左上角的 按钮，在“目标规则”下拉列表中选择要编辑的CSS样式，然后单击 按钮；,执行“窗口”/“CSS样式”命令打开“CSS样式”面板，在样式列表中双击要修改的样式； 在“CSS样式”面板中选中要修改的样式，
8、然后单击“CSS样式”面板底部的编辑样式图标，打开“CSS规则定义”对话框；,执行“窗口”/“CSS样式”命令打开“CSS样式”面板，单击面板下方的属性值，当属性值区域变为可编辑状态时，直接对选中的属性进行修改。,4.3.4 CSS样式的应用,4.4 添加超级链接,4.4.1 链接的基本知识,超链接由两部分组成，一部分是在浏览网页时可以看到的部分，称为超链接载体，另一部分是超链接所链接的目标。在浏览页面时单击超链接的载体将会打开该目标。链接的目标可以是网页、图片、视频或声音和电子邮件地址等。关于超级链接的重要概念有： 1URL 2绝对路径 3文档相对路径 4根相对路径 5锚点（Anchor）,
9、4.4.2 创建链接,1、在文档窗口中选中需要建立链接的文本。 2、在属性面板的“链接”文本框中输入链接目标；或选择“窗口”/“属性”菜单命令打开属性面板。在“链接”后的文本框中输入链接目标。 默认情况下，文本链接显示为蓝色，并加有下划线。用户可以选择“修改”/“页面属性”菜单命令，在“页面属性”面板的“链接”分类页面设置超级链接在各种状态下的颜色，以及选择是否显示下划线。,注意：Dreamweaver不支持扩展字符集（也被称为High ASCII），所以在指定链接的URL时，不能包含扩展字符集，且完全的URL最多不能超过255个字符。此外，尽管大多数浏览器可以解释路径名或URL中的空格，但在
10、UNIX应用中，空格会被变为%20，这将使得URL比较难看。,如果链接目标是计算上的一个文件或图片，可以单击“链接”文本框右侧的文件夹图标，打开“选择文件”对话框，查找并选择文件。或者选择“指向文件”图标 ，并按下鼠标左键拖动到“文件”面板中一个现存的页面。,4.4.3 链接到命名锚点,通常情况下，当使用绝对地址或相对地址链接到一个Web页面时，浏览器都会重新载入并显示这个页面。如果网页的内容比较多，浏览者就必须通过滚动方式来查看当前屏幕以下的信息。使用命名锚点则可以立即响应浏览者单击锚点的事件，由于整个页面已被载入，所以浏览器只需移动到文档中的特定位置。这种技术使得用户能够迅速定位需要的主题
11、或返回菜单，而无需手工来回滚动页面了。 命名锚点常用于长篇文章、技术文件等内容的网页，通常放置在网页中每个屏幕或每个主题之后，当用户单击某一个命名锚点时可以转到网页的特定段落，以方便文章的阅读。,注意：锚点名称必须是惟一的，只能包含小写的ASCII字母和数字，且不能以数字开头。在“链接”文本框中输入锚点名称时，需要在锚点名称前面添加一个特殊的符号“#”。如果所链接的锚点不在当前文档中，则在“链接”文本框中先添加链接页面的URL，然后输入井号和锚点名称。例如，index.html#top。,1.单击“插入”面板上的“常用”标签，选择命名锚记图标，打开“命名锚记”对话框。在“锚记名称”文本框中键入
12、锚点的名称。 2.选择要链接到命名锚点的文字，然后在属性设置面板的“链接”文本框中输入锚点的名称。,4.4.4 创建E-Mail链接,1.在文档窗口的设计视图中，选中需要创建E-Mail链接的文本或图像。 2.在属性面板的“链接”文本框中输入发件人的地址。,在“链接”文本框中输入邮件地址时，和创建常规超链接不同，在邮件地址前面必须添加“mailto:”，表示该超级链接是邮件链接。,如果没有选中任何文本或图像，用户可以通过执行“插入”/“电子邮件链接”菜单命令， 在弹出的“电子邮件链接”对话框在页面中插入E-Mail链接。,5.2.5 虚拟链接和脚本链接,虚拟链接也称为空链接，是指没有指定的链接，一般用于向页面上的文本或对象添加行为。虚拟链接主要包含以下两种格式： 虚拟链接 虚拟链接 第1种格式被单击时将返回到页面顶部，这种格式无法添加行为；第2种格式则不会发生任何动作，就好像根本没有单击一样。,如果为第2种虚拟链接添加了动作脚本，则执行相应的动作行为，此时的链接即为脚本链接。脚本链接可以执行JavaScript代码或调用JavaScript函数，用于在不离开当前网页的情况下给予访问者有关项目的补充信息。脚本链接也可用于在访问者点击特定项目时执行计算、表单验证和其它处理任务。,4.5 文本与链接网页实例,
