《Dreamweaver CS6 完全自学教程》笔记 第二章：Dreamweaver CS6 入门

---

第二章：Dreamweaver CS6 入门

---

2.1 Dreamweaver CS6 概述

Dreamweaver CS6 是世界顶级软件厂商 adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。由于它支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页（通常是标准通用标记语言下的一个应用HTML），对于初级人员，你可以无需编写任何代码就能快速创建web页面。——
百度百科

---

2.2 Dreamweaver CS6 的启动与退出

这个我感觉没什么好说的，就略写了

2.2.1 启动 Dreamweaver CS6

1. 初次打开时，显示的是 “设计器” 界面布局和 “欢迎屏幕”
   
   若想再次显示欢迎屏幕，可以选择 编辑 > 首选参数 > 常规 然后选中 “显示欢迎屏幕”。

2. Dreamweaver CS6 提供了多种开发环境，可以在如图位置更换
   
   

2.2.2 退出 Dreamweaver CS6

1. 双击左上角的图标
2. 快捷键：Alt+F4
   
   
   
   

---

2.3 Dreamweaver CS6 的工作界面

---

常用选项

记录一些比较有用的、不容易找到的，或者自己经常忘记在哪的选项路径和快捷键。不定期更新~

1. 属性面板：窗口 > 属性 。 快捷键：Ctrl+F3
2. 自定义快捷键：编辑 > 快捷键
3. 插入特殊字符：Shift + Enter 插入换行符、Ctrl + Shift + Space 插入一个不换行空格
4. 在网页中插入图像：插入 -> 图像 。快捷键： Ctrl + Alt + I
5. 设置页面属性：修改 -> 页面属性 或 属性面板点击 “页面属性” 。快捷键： Ctrl + J
6. 定义模板的可编辑区域：插入 -> 模板对象 -> 可编辑区域 。快捷键： Ctrl + Alt + V

---

2.4 自定义工作界面

2.5 网页的创建与保存

这两个是在没什么好说的。。。跳过好了

---

2.6 可视化辅助工具

各种工具的介绍，笔记笔记~

2.6.1 标尺工具

可以精确的计算网页高度、宽度。

相关操作：

• 通过 查看 > 标尺 > 显示 可以打开或关闭标尺

• 标尺原点默认位置在左上角，但可以拖动到任意位置。通过 查看 > 标尺 > 重设原点 可以将原点恢复到默认位置

• 通过 查看 > 标尺 > 像素 可改变单位
  
  
  
  

2.6.2 网格工具

可以让页面的元素自动靠齐，注意，无论网格是否可见，都可以使用网格靠齐。

相关操作：

• 通过 查看 > 网格设置 > 显示网格 来显示或关闭网格

• 通过 查看 > 网格设置 > 网格设置 可以进行网格设置

【“网格设置”参数介绍】

• 显示网格： 可使网格在设计视图中可见。
• 靠齐到网格： 可使网格中的层自动靠齐到网格。
  
  
  

2.6.3 辅助线工具

辅助线通常与标尺配合使用。

相关操作：

• 通过 查看 > 辅助线 > 显示辅助线 显示辅助线，然后再文档上方标尺中向文档拖拽，可创建辅助线。可以创建多条水平和垂直辅助线。

• 通过 查看 > 辅助线 > 清除辅助线 删除全部辅助线，也可将辅助线拖拽到文档外来删除一条辅助线。

• 通过 查看 > 辅助线 > 编辑辅助线 对辅助线进行设置。

• 按住 Ctrl 可显示距离。

【“辅助线”参数介绍】

• 距离颜色： 按住 Ctrl 出现的距离指示器颜色。
• 锁定辅助线： 可将辅助线锁定在适当位置。
• 靠齐辅助线： 页面元素在移动时靠齐辅助线。
• 辅助线靠齐元素： 拖拽辅助线时将靠齐页面元素。
  
  
  

---

2.7 首选参数设置

快捷键：Ctrl + U

2.7.1 常规参数

这个没什么好说的，可以自己去改一下，让软件更人性化

2.7.2 代码格式

• 换行符类型： 每个操作系统的结束符类型都是不同的，Mac 使用 CR (carriage return) ，Unix 使用 LF (line feed) ，Windows 使用 CR 和 LF。 如果知道远程服务器的类型，选择正确的换行符类型可以确保源代码在远程服务器上正确显示。
• TD标签： 可以确保在 <td> 内没有换行符。
• 高级格式设置： 可以设置 CSS 与标签库。
  
  
  
  

2.7.3 代码颜色

好看的代码颜色可以提高工作效率，并且让人心情舒畅

2.7.4 复制粘贴

CV大法好

• 仅文本： 粘贴无格式的纯文本，分行和段落都会被删除。
• 带结构的文本： 保留结构，但不保留基本格式设置，如列表、间隔、分行、段落。
• 带结构的文本以及基本格式： 粘贴简单的格式化文本，如加粗、下划线。如果文本是从 HTML 文档复制过来的，还将保留所有 HTML 类型标签。
• 带结构的文本以及全部格式： 保留所有结构和格式。
  
  
  
  

2.7.5 在浏览器中预览

• “+” 、“-”： 添加浏览器或删除选中浏览器。
• 使用临时文件预览： 将创建用于预览和调试的临时文件，而不是直接更新当前文档。
  
  
  
  

2.7.6 字体

• 均衡字体： 在正规文本中使用的字体。
• 固定字体： 在 <pre>、<code>、<tt> 标记中使用的字体。
• 代码视图： 显示在代码面板中文本的字体，默认与 固定字体 相同
• 使用动态字体映射： 可以定义模拟设备时使用的字体。在网页文件中，可以指定通用设备字体。 Dreamweaver 会在运行时尝试将通用设备字体与可用字体匹配。
  
  
  
  

实战：自定义快捷键

实战：自定义代码视图

---

第二章总结

这一章介绍了 Dreamweaver 的界面、工具、设置，很多都非常简单，没什么难度，但实用性很强，尤其是工具部分和快捷键部分，所以以后会不定时更新，不断积累。
这里放一下更新记录，方便大家查找。
*************************************
更新时间：2020-3-19 11:50 p.m.
更新内容：第二章笔记
*************************************
更新时间：2020-7-26  1:19  p.m.
更新内容：快捷键
*************************************
更新时间：2020-8-16 10:23 a.m.
更新内容：快捷键
*************************************

---

返回