- On: 2025-12-28 22:48:49
- By: admin
Dreamweaver
打开应用程序
Dreamweaver 用户指南
简介
响应式网页设计基础知识
Dreamweaver 中的新增功能
使用 Dreamweaver 进行 Web 开发 - 概述
Dreamweaver/常见问题
键盘快捷键
Dreamweaver 系统要求
功能摘要
Dreamweaver 和 Creative Cloud
将 Dreamweaver 设置与 Creative Cloud 同步
Dreamweaver 中的 Creative Cloud Libraries
在 Dreamweaver 中使用 Photoshop 文件
使用 Adobe Animate 和 Dreamweaver
从库提取 Web 优化的 SVG 文件
Dreamweaver 工作区和视图
Dreamweaver 工作区
为可视化开发优化 Dreamweaver 工作区
根据文件名或内容搜索文件 | Mac OS
设置站点
关于 Dreamweaver 站点
设置站点的本地版本
连接到发布服务器
设置测试服务器
导入和导出 Dreamweaver 站点设置
将现有网站从远程服务器下载到您的本地站点根目录
Dreamweaver 中的辅助功能
高级设置
设置用于传输文件的站点偏好设置
在 Dreamweaver 中指定代理服务器设置
将 Dreamweaver 设置与 Creative Cloud 同步
在 Dreamweaver 中使用 Git
管理文件
创建和打开文件
管理文件和文件夹
从服务器获取文件和将文件上传到服务器
存回和取出文件
同步文件
比较文件的差别
遮盖 Dreamweaver 站点中的文件和文件夹
为 Dreamweaver 站点启用设计备注
防止潜在的 Gatekeeper 漏洞
布局和设计
使用可视化助理进行布局
关于使用 CSS 来设计页面布局
使用 Bootstrap 设计响应式网站
在 Dreamweaver 中创建和使用媒体查询
使用表格显示内容
颜色
使用流式网格布局的响应式设计
Dreamweaver 中的 Extract
CSS
了解层叠样式表
使用 CSS Designer 进行页面布局
在 Dreamweaver 中使用 CSS 预处理器
如何在 Dreamweaver 中设置 CSS 样式偏好设置
在 Dreamweaver 中移动 CSS 规则
在 Dreamweaver 中将内联 CSS 转换为 CSS 规则
使用 div 标签
向背景应用渐变效果
在 Dreamweaver 中创建和编辑 CSS3 过渡效果
设置代码格式
页面内容和资源
设置页面属性
设置 CSS 标题属性和 CSS 链接属性
使用文本
查找和替换文本、标签和属性
DOM 面板
在实时视图中编辑
在 Dreamweaver 中对文档编码
在“文档”窗口中选择和查看元素
在属性检查器中设置文本属性
对网页进行拼写检查
在 Dreamweaver 中使用水平线
在 Dreamweaver 中添加和修改字体组合
使用资源
在 Dreamweaver 中插入和更新日期
在 Dreamweaver 中创建和管理收藏资源
在 Dreamweaver 中插入和编辑图像
添加媒体对象
在 Dreamweaver 中添加视频
插入 HTML5 视频
插入 SWF 文件
添加音频效果
在 Dreamweaver 中插入 HTML5 音频
使用库项目
在 Dreamweaver 中使用阿拉伯语和希伯来语文本
链接与导航
关于链接与导航
链接
图像地图
链接疑难解答
jQuery 构件和效果
在 Dreamweaver 中使用 jQuery UI 和移动构件
在 Dreamweaver 中使用 jQuery 效果
对网站进行编码
关于在 Dreamweaver 中编码
Dreamweaver 中的编码环境
设置编码偏好设置
自定义代码颜色
编写和编辑代码
代码提示和代码完成
折叠和展开代码
使用代码片段重用代码
使用 linting 检查代码
优化代码
在设计视图中编辑代码
使用页面的头内容
在 Dreamweaver 中插入服务器端包含
在 Dreamweaver 中使用标签库
将自定义标签导入 Dreamweaver
使用 JavaScript 行为（一般说明）
应用内置 JavaScript 行为
关于 XML 和 XSLT
在 Dreamweaver 中执行服务器端 XSL 转换
在 Dreamweaver 中执行客户端 XSL 转换
在 Dreamweaver 中为 XSLT 添加字符实体
设置代码格式
跨产品工作流
安装和使用 Dreamweaver 的扩展
Dreamweaver 中的应用程序内更新
在 Dreamweaver 中插入 Microsoft Office 文档（仅限 Windows）
使用 Fireworks 和 Dreamweaver
使用 Contribute 编辑 Dreamweaver 站点中的内容
Dreamweaver 和 Business Catalyst 集成
创建个性化的电子邮件营销活动
模板
关于 Dreamweaver 模板
识别模板和基于模板的文档
创建 Dreamweaver 模板
在模板中创建可编辑区域
在 Dreamweaver 中创建重复区域和表格
在模板中使用可选区域
在 Dreamweaver 中定义可编辑的标签属性
如何在 Dreamweaver 中创建嵌套模板
编辑、更新和删除模板
在 Dreamweaver 中导出和导入 xml 内容
在现有文档中应用或删除模板
在 Dreamweaver 模板中编辑内容
Dreamweaver 中模板标签的语法规则
设置模板区域的高亮显示偏好设置
在 Dreamweaver 中使用模板的好处
移动设备和多屏幕
创建媒体查询
更改移动设备的页面方向
使用 Dreamweaver 创建适用于移动设备的 Web 应用程序
动态网站、页面和 Web 表单
了解 Web 应用程序
设置计算机以进行应用程序开发
数据库连接疑难解答
在 Dreamweaver 中删除连接脚本
设计动态页
动态内容源概述
定义动态内容源
向页面添加动态内容
在 Dreamweaver 中更改动态内容
显示数据库记录
在 Dreamweaver 中提供动态数据和进行疑难解答
在 Dreamweaver 中添加自定义服务器行为
使用 Dreamweaver 生成表单
使用表单从用户处收集信息
在 Dreamweaver 中创建和启用 ColdFusion 表单
创建 Web 表单
增强了对表单元素的 HTML5 支持
使用 Dreamweaver 开发表单
以可视化方式生成应用程序
在 Dreamweaver 中生成主页和详细页
生成搜索页和结果页
生成记录插入页
在 Dreamweaver 中生成更新记录页
在 Dreamweaver 中生成记录删除页
在 Dreamweaver 中使用 ASP 命令修改数据库
生成注册页
生成登录页
生成只有授权用户才能访问的页面
使用 Dreamweaver 保护 Coldfusion 中的文件夹
在 Dreamweaver 中使用 ColdFusion 组件
测试、预览和发布网站
预览页面
在多个设备上预览 Dreamweaver 网页
测试 Dreamweaver 站点
疑难解答
已修复的问题
已知问题
了解如何设置网页之间的导航。在 Dreamweaver 中链接文件和文档，更新、更改和测试链接。
创建链接之前，一定要清楚绝对路径、文档相对路径以及站点根目录相对路径的工作方式。在一个文档中可以创建几种类型的链接：
链接到其它文档或文件（如图形、影片、PDF 或声音文件）的链接。
命名锚点链接，此类链接跳转至文档内的特定位置。
电子邮件链接，此类链接新建一个已填好收件人地址的空白电子邮件。
空链接和脚本链接，此类链接用于在对象上附加行为，或者创建执行 JavaScript 代码的链接。
属性检查器和“指向文件”图标可用于创建从图像、对象或文本到其它文档或文件的链接。
Dreamweaver 使用文档相对路径创建站点中其他页面的链接。还可让 Dreamweaver 使用站点根目录相对路径创建新链接。
应始终先保存新文件，然后再创建文档相对路径，因为没有确切起点，文档相对路径即无效。如果在保存文件之前创建文档相对路径，则 Dreamweaver 将临时使用以 file:// 开头的绝对路径，直至保存该文件；保存该文件后，Dreamweaver 将 file:// 路径转换为相对路径。
向链接中附加 JavaScript 行为
可为文档中的任何链接附加行为。在文档中插入链接元素时，有如下几种行为可供选择：
设置状态栏文本
确定消息的文本，并将其显示在浏览器窗口左下部的状态栏中。例如，您可以使用此行为在状态栏中说明链接的目标，而不是显示与之关联的 URL。
打开浏览器窗口
在一个新窗口中打开 URL。您可以指定新窗口的属性（包括其名称和大小）和特性（它是否可以调整大小、是否具有菜单栏等）。
跳转菜单
编辑跳转菜单。可以更改菜单列表、指定其他链接文件或者更改打开所链接文档的浏览器位置。
使用属性检查器链接到文档
可以使用属性检查器的文件夹图标或“链接”框创建从图像、对象或文本到其他文档或文件的链接。
在“文档”窗口的“设计”视图中选择文本或图像。
打开属性检查器（“窗口”>“属性”），然后执行下列操作之一：
单击“链接”框右侧的文件夹图标，浏览到并选择一个文件。
指向所链接的文档的路径显示在 URL 框中。使用“选择文件”对话框中的“相对于”弹出菜单，使路径成为文档相对路径或根目录相对路径，然后单击“确定”。您选择的路径类型只适用于当前链接。（您可以针对该站点更改“相对于”框的默认设置。）
在“链接”框中键入文档的路径和文件名。
若要链接到站点内的文档，请输入文档相对路径或站点根目录相对路径。若要链接到站点外的文档，请输入包含协议（如 http://）的绝对路径。此种方法可用于输入尚未创建的文件的链接。
从“目标”下拉列表中，选择文档的打开位置：
_blank 将链接的文档载入一个新的、未命名的浏览器窗口。
_parent 将链接的文档加载到该链接所在框架的父框架或父窗口。如果包含链接的框架不是嵌套框架，则所链接的文档加载到整个浏览器窗口。
_self 将链接的文档载入链接所在的同一框架或窗口。此目标是默认的，所以通常不需要指定它。
_top 将链接的文档载入整个浏览器窗口，从而删除所有框架。
_new 将链接文档载入一个新窗口。
使用“指向文件”图标链接文档
在“文档”窗口的“设计”视图中选择文本或图像。
以下列两种方法之一创建链接：
拖动属性检查器中“链接”框右侧的“指向文件”图标 （目标图标），指向当前文档中的可见锚点、另一个打开文档中的可见锚点、分配有唯一 ID 的元素或“文件”面板中的文档。
按 Shift 键并拖动所选内容，指向当前文档中的可见锚点、另一个打开文档中的可见锚点、分配有唯一 ID 的元素或者“文件”面板中的文档。
仅当您的文档在“文档”窗口中未最大化时，才能链接到另一打开的文档。要平铺文档，请选择“窗口”>“排列”>“层叠”或“窗口”>“排列”>“平铺”。如果指向打开的文档，则在进行选择时，该文档移至屏幕的最前面。
使用“超链接”命令添加链接
“超链接”命令可以创建到图像、对象或其它文档或文件的文本链接。
将插入点放在文档中希望出现链接的位置。
执行下列操作之一以显示“超链接”对话框：
选择“插入”>“超链接”。
在“插入”面板的“常用”类别中，单击“超链接”按钮。
在“文本”字段中，输入链接的文本。从“链接”下拉菜单中，选择要链接到的文件的名称。您还可以单击文件夹图标以浏览到要链接到的文件。
在“目标”弹出菜单中选择一个窗口（应在该窗口中打开该文件）或键入其名称。
当前文档中所有已命名框架的名称都显示在此弹出列表中。如果指定的框架不存在，所链接的页面会在一个新窗口中打开，该窗口使用您所指定的名称。也可选用下列保留目标名：
_blank 将链接的文件载入新的未命名浏览器窗口。
_parent 将链接的文件加载到含有该链接的框架的父框架集或父窗口中。如果包含链接的框架不是嵌套的，则链接文件加载到整个浏览器窗口中。
_self 将链接的文件加载到该链接所在的同一框架或窗口中。此目标是默认的，所以通常不需要指定它。
_top 将链接的文件加载到整个浏览器窗口中，因而会删除所有框架。
_new 将链接文档载入一个新窗口。
在“Tab 键索引”框中，输入 Tab 顺序的编号。
在“标题”框中，输入链接的标题。
在“访问键”框中，输入可用来在浏览器中选择该链接的等效键盘键（一个字母）。
单击“确定”。
创建指向 Word 或 Excel 文档的链接
您可以将指向 Microsoft Word 或 Excel 文档的链接插入到现有页面中。
在“设计”视图中，打开希望显示链接的页面。
将文件从当前位置拖放到 Dreamweaver 页面中，可将链接放在任何位置。此时将显示“插入文档”对话框。
选择“创建链接”，然后单击“确定”。
如果您要链接的文档位于站点根文件夹以外，Dreamweaver 将提示您将文档复制到站点根文件夹中。
通过将文档复制到站点根文件夹中，可以确保发布网站时该文档可用。
当您将页面上传到 Web 服务器时，请确保同时上传 Word 或 Excel 文件。您的页面现在包含指向 Word 或 Excel 文档的链接。链接文本是链接的文件的名称；如果愿意，您可以在“文档”窗口中更改链接文本。
设置新链接的相对路径
默认情况下，Dreamweaver 使用文档相对路径创建指向站点中其他页面的链接。要改用站点根目录相对路径，必须先通过选择本地根文件夹，在 Dreamweaver 中定义本地文件夹以充当服务器上文档根目录的等效目录。Dreamweaver 使用此文件夹确定文件的站点根目录相对路径。
选择“站点”>“管理站点”。
在“管理站点”对话框中，在列表中双击您的站点。
在“站点设置”对话框中，展开“高级设置”并选择“本地信息”类别。
选择“文档”或“站点根目录”选项，从而设置新链接的相对路径。
单击“确定”后，更改此设置将不会转换现有链接的路径。该设置仅适用于通过 Dreamweaver 创建的新链接。
单击“保存”。
新路径设置只适用于当前站点。
链接到文档中的特定位置
通过首先创建命名锚点，可使用属性检查器链接到文档的特定部分。命名锚点使您可以在文档中设置标记，这些标记通常放在文档的特定主题处或顶部。然后可以创建到这些命名锚点的链接，这些链接可快速将访问者带到指定位置。
创建到命名锚点的链接的过程分为两步。首先，创建命名锚点，然后创建到该命名锚点的链接。
创建锚点
在“文档”窗口中，选择并突出显示要设置为锚点的项目。
打开属性检查器并检查所选项目是否具有 ID。如果 ID 字段为空，请添加 ID。例如，锚点。
创建锚点
创建锚点
添加 ID 后，请注意代码所发生的更改。id="
添加用于链接的锚点
添加用于链接的锚点
链接回锚点
在“文档”窗口的“设计”视图中，选择要从其创建链接的文本或图像。
在属性检查器的“链接”框中，键入一个数字符号 (#) 和锚点名称。例如，若要链接到当前文档中名为“top”的锚点，请键入 #top。若要链接到同一文件夹内其他文档中的名为“top”的锚点，请键入 filename.html#top。
注意:
锚点名称区分大小写。
使用指向文件方法链接到命名锚点
打开包含对应命名锚点的文档。
注意:
如果您未看到锚点，可从“设计”视图中，选择“视图”>“设计视图选项”>“可视化助理”>“不可见元素”以使锚点可见。
在“文档”窗口的“设计”视图中，选择要从其创建链接的文本或图像。（如果这是其他打开文档，则必须切换到该文档。）
执行下列操作之一：
单击属性检查器中“链接”框右侧的“指向文件”图标 （目标图标），然后将它拖到要链接到的锚点上：可以是同一文档中的锚点，也可以是其它打开文档中的锚点。
在“文档”窗口中，按住 Shift，从所选文本或图像拖动到要链接到的锚点：可以是同一文档中的锚点，也可以是其它打开文档中的锚点。
创建电子邮件链接
单击电子邮件链接时，该链接将打开一个新的空白信息窗口（使用的是与用户浏览器相关联的邮件程序）。在电子邮件消息窗口中，“收件人”框自动更新为显示电子邮件链接中指定的地址。
使用“插入电子邮件链接”命令创建电子邮件链接
在“文档”窗口的“设计”视图中，将插入点放在希望出现电子邮件链接的位置，或者选择要作为电子邮件链接出现的文本或图像。
执行下列操作之一，插入该链接：
选择“插入”>“电子邮件链接”。
在“插入”面板的“常用”类别中，单击“电子邮件链接”按钮。
在“文本”框中，键入或编辑电子邮件的正文。
在“E-mail”框中，键入电子邮件地址，然后单击“确定”。
使用属性检查器创建电子邮件链接
在“文档”窗口的“设计”视图中选择文本或图像。
在属性检查器的“链接”框中，键入 mailto:，后跟电子邮件地址。
在冒号与电子邮件地址之间不能键入任何空格。
自动填充电子邮件的主题行
如上所述，使用属性检查器创建电子邮件链接。
在属性检查器的“链接”框中，在电子邮件地址后添加 ?subject=，并在等号后输入一个主题。在问号和电子邮件地址结尾之间不能键入任何空格。
完整输入如下所示：
mailto:someone@yoursite.com?subject=Mail from Our Site
创建空链接和脚本链接
空链接是未指派的链接。空链接用于向页面上的对象或文本附加行为。例如，可向空链接附加一个行为，以便在指针滑过该链接时会交换图像或显示绝对定位的元素（AP 元素）。
脚本链接 执行 JavaScript 代码或调用 JavaScript 函数。它非常有用，能够在不离开当前网页面的情况下为访问者提供有关某项的附加信息。脚本链接还可用于在访问者单击特定项时，执行计算、验证表单和完成其他处理任务。
创建空链接
在“文档”窗口的“设计”视图中选择文本、图像或对象。
在属性检查器中，在“链接”框中键入 javascript:;（javascript 一词后依次接一个冒号和一个分号）。
创建脚本链接
在“文档”窗口的“设计”视图中选择文本、图像或对象。
在属性检查器的“链接”框中，键入 javascript:，后跟一些 JavaScript 代码或一个函数调用。（在冒号与代码或调用之间不能键入空格。）
自动更新链接
移动或重命名本地站点内的文档时，Dreamweaver 可更新来自和指向该文档的链接。在将整个站点（或其中完全独立的一个部分）存储在本地磁盘上时，此项功能最适用。Dreamweaver 直到将本地文件放在远程服务器上或将其存回远程服务器后才更改远程文件夹中的文件。
为了加快更新过程，Dreamweaver 可创建缓存文件，从中存储有关本地文件夹中所有链接的信息。在添加、更改或删除本地站点上的链接时，该缓存文件以不可见的方式进行更新。
启用自动链接更新
选择“编辑”>“偏好设置” (Windows) 或 “Dreamweaver”>“偏好设置” (Macintosh)。
在“偏好设置”对话框中，从左侧的“类别”列表中选择“常规”。
在“常规”偏好设置的“文档选项”部分，从“移动文件时更新链接”弹出菜单中选择一个选项。
总是
每当移动或重命名选定文档时，自动更新起自和指向该文档的所有链接。
从不
在您移动或重命名选定文档时，不自动更新起自和指向该文档的所有链接。
提示
显示一个对话框，列出此更改影响到的所有文件。单击“更新”可更新这些文件中的链接，而单击“不更新”将保留原文件不变。
单击“确定”。
为站点创建缓存文件
选择“站点”>“管理站点”。
选择一个站点，然后单击“编辑”。
在“站点设置”对话框中，展开“高级设置”并选择“本地信息”类别。
在“本地信息”类别中，选择“启用缓存”。
启动 Dreamweaver 后首次更改或删除指向本地文件夹中文件的链接时，Dreamweaver 提示加载缓存。如果单击“是”，则 Dreamweaver 加载缓存，并更新所有指向刚刚更改的文件的链接。如果单击“否”，则将更改记入缓存，但 Dreamweaver 不加载缓存或更新链接。
在大型站点上加载缓存可能耗时几分钟，因为 Dreamweaver 必须通过比较本地站点上文件的时间戳与缓存中记录的时间戳，判断缓存是否为最新。如果没有在 Dreamweaver 之外更改任何文件，则显示“停止”按钮时，可放心地单击该按钮。
重新创建缓存
在“文件”面板中，选择“站点”>“高级”>“重建站点缓存”。
在整个站点范围内更改链接
除移动或重命名文件时让 Dreamweaver 自动更新链接之外，还可手动更改所有链接（包括电子邮件链接、FTP 链接、空链接和脚本链接），使其指向其他某处。
此选项最适用于删除其他文件所链接到的某个文件，不过也可以将它用于其他用途。例如，您可能已经在整个站点内将“本月电影”一词链接到 /movies/july.html。而到了 8 月 1 日，则必须将那些链接更改为指向 /movies/august.html。
在“文件”面板的“本地”视图中选择一个文件。
注意:
如果更改的是电子邮件链接、FTP 链接、空链接或脚本链接，则不需要选择文件。
选择“站点”>“站点选项”>“更改整个站点链接”。
在“更改整个站点链接”对话框中完成下列选项：
更改所有的链接
单击文件夹图标 ，浏览到并选择要取消链接的目标文件。如果更改的是电子邮件链接、FTP 链接、空链接或脚本链接，请键入要更改的链接的完整文本。
链接到
单击文件夹图标 ，浏览到并选择要链接到的新文件。如果更改的是电子邮件链接、FTP 链接、空链接或脚本链接，请键入替换链接的完整文本。
单击“确定”。
Dreamweaver 更新任何链接到所选文件的文档，其中沿用已在文档中使用的路径格式（例如，如果旧路径相对于文档，则新路径也相对于文档），使这些文档指向新文件。
在整个站点范围内更改某个链接后，所选文件变为孤立文件（即本地硬盘上没有任何文件指向该文件）。这时可安全地删除该文件，而不会破坏本地 Dreamweaver 站点中的任何链接。
注意:
因为这些更改是在本地进行的，所以必须手动删除远程文件夹中的相应独立文件，然后存回或取出链接已经更改的所有文件；否则，站点访问者将看不到这些更改。
在 Dreamweaver 中测试链接
链接在 Dreamweaver 内不活动，即无法通过在“文档”窗口中单击链接，打开所链接的文档。
执行下列操作之一：
右键单击链接并选择“打开链接页面”。
按下 Ctrl（在 Windows 中）或者按下 Command 键（在 Macintosh 中），同时双击选中的链接。
注意:
链接的文档必须驻留在本地磁盘上。
更多相似内容 视频教程：如何将超链接添加到整个或部分图像中 绝对、文档相对和站点根目录相对路径 创建链接教程 应用内置 JavaScript 行为 使用 Dreamweaver 站点 修复断开的链接 应用行为 查找断开、外部和孤立的链接