- Dreamweaver 用户指南
- 简介
- Dreamweaver 和 Creative Cloud
- Dreamweaver 工作区和视图
- 设置站点
- 管理文件
- 布局和设计
- CSS
- 页面内容和资源
- 设置页面属性
- 设置 CSS 标题属性和 CSS 链接属性
- 使用文本
- 查找和替换文本、标签和属性
- DOM 面板
- 在实时视图中编辑
- 在 Dreamweaver 中对文档编码
- 在“文档”窗口中选择和查看元素
- 在属性检查器中设置文本属性
- 对网页进行拼写检查
- 在 Dreamweaver 中使用水平线
- 在 Dreamweaver 中添加和修改字体组合
- 使用资源
- 在 Dreamweaver 中插入和更新日期
- 在 Dreamweaver 中创建和管理收藏资源
- 在 Dreamweaver 中插入和编辑图像
- 添加媒体对象
- 在 Dreamweaver 中添加视频
- 插入 HTML5 视频
- 插入 SWF 文件
- 添加音频效果
- 在 Dreamweaver 中插入 HTML5 音频
- 使用库项目
- 在 Dreamweaver 中使用阿拉伯语和希伯来语文本
- 链接与导航
- jQuery 构件和效果
- 对网站进行编码
- 关于在 Dreamweaver 中编码
- Dreamweaver 中的编码环境
- 设置编码偏好设置
- 自定义代码颜色
- 编写和编辑代码
- 代码提示和代码完成
- 折叠和展开代码
- 使用代码片段重用代码
- 使用 linting 检查代码
- 优化代码
- 在设计视图中编辑代码
- 使用页面的头内容
- 在 Dreamweaver 中插入服务器端包含
- 在 Dreamweaver 中使用标签库
- 将自定义标签导入 Dreamweaver
- 使用 JavaScript 行为(一般说明)
- 应用内置 JavaScript 行为
- 关于 XML 和 XSLT
- 在 Dreamweaver 中执行服务器端 XSL 转换
- 在 Dreamweaver 中执行客户端 XSL 转换
- 在 Dreamweaver 中为 XSLT 添加字符实体
- 设置代码格式
- 跨产品工作流
- 模板
- 移动设备和多屏幕
- 动态网站、页面和 Web 表单
- 以可视化方式生成应用程序
- 测试、预览和发布网站
- 疑难解答
了解如何在 Dreamweaver“设计”视图和“代码”视图中识别模板和基于模板的文档。
在“设计”视图中识别模板
在“设计”视图中,可编辑区域出现在“文档”窗口的矩形外框中。查看“文档”窗口中的底部窗格可看到区域的名称。
通过查看“文档”窗口中的标题栏,可以识别模板文件。文件的文件扩展名为 .dwt。
在“代码”视图中识别模板
在“代码”视图中,使用以下注释标记 HTML 中的可编辑内容区域:
<!-- TemplateBeginEditable> 和 <!-- TemplateEndEditable -->
您可以使用代码颜色首选参数设置自己的配色方案,以便在“代码”视图中查看文档时可以轻松地区分模板区域。
这些注释之间的任何内容都可以在基于模板的文档中编辑。可编辑区域的 HTML 源代码可能类似于如下形式:
<table width="75%" border="1" cellspacing="0" cellpadding="0"> <tr bgcolor="#333366"> <td>Name</td> <td><font color="#FFFFFF">Address</font></td> <td><font color="#FFFFFF">Telephone Number</font></td> </tr> <!-- TemplateBeginEditable name="LocationList" --> <tr> <td>Enter name</td> <td>Enter Address</td> <td>Enter Telephone</td> </tr> <!-- TemplateEndEditable --> </table>
在“代码”视图中编辑模板代码时请小心,避免更改 Dreamweaver 所依赖的任何与模板相关的注释标签。
在“设计”视图中识别基于模板的文档
在基于模板的文档中,“文档”窗口的“设计”视图中的可编辑区域周围会以虚线显示矩形外框。窗口底部将显示区域的名称。
除可编辑区域的外框之外,整个页面周围也会显示其他颜色的外框,右上角的选项卡给出该文档的基础模板的名称。这一高亮矩形提醒您相应文档基于某个模板,您不能更改可编辑区域之外的内容。
在“代码”视图中识别基于模板的文档
在“代码”视图中,派生自模板的文档的可编辑区域用与不可编辑区域中的代码不同的颜色显示。只能更改可编辑区域或可编辑参数中的代码;但是不能在锁定区域中键入内容。
在 HTML 中使用以下 Dreamweaver 注释标记可编辑内容:
<!‑‑InstanceBeginEditable> 和 <!‑‑InstanceEndEditable ‑‑>
这些注释之间的任何内容都可以在基于模板的文档中编辑。可编辑区域的 HTML 源代码可能类似于如下形式:
<body bgcolor="#FFFFFF" leftmargin="0"> <table width="75%" border="1" cellspacing="0" cellpadding="0"> <tr bgcolor="#333366"> <td>Name</td> <td><font color="#FFFFFF">Address</font></td> <td><font color="#FFFFFF">Telephone Number</font></td> </tr> <!-- InstanceBeginEditable name="LocationList" --> <tr> <td>Enter name</td> <td>Enter Address</td> <td>Enter Telephone</td> </tr> <!-- InstanceEndEditable --> </table> </body>
不可编辑文本的默认颜色是灰色;您可以在“首选参数”对话框中为可编辑区域和不可编辑区域选择不同的颜色。