专业网页设计工具Adobe Dreamweaver CC 2017 v17.0 中文免费版

Adobe Dreamweaver CC 2017官方中文版是Adobe公司官方发布的一款网页设计软件，集成简体中文。使用Adobe Dreamweaver CC 2017可以在可视化环境中设计的你网页，非常方便高效完成网页设计。Adobe Dreamweaver CC 2017支持CSS编辑器、和jQuery库代码自动完成功能等等。

用Dreamweaver 很多年，Dreamweaver cs6 到 Dreamweaver cc 2017 的变化实在是太大，简直是颠覆性的变化

如果你还没有准备好，可能会有些不习惯这个新工具，它的性格变了，我们不可以改，我们可以去适应，定会发现它的魅力!

Dreamweaver cc 将新流行起来的云服务集合了起来，并在功能上添加了很多的新功能，唯一的遗憾是它感觉比cs系列的反应慢，可能是采用java开发的原因吧，我没有看有介绍它是用Java开发的，但是通过我对NetBeans的感觉，Dreamweaver cc 后来也是Java开发的，拥有java语言的毛病!

Dreamweaver cc 在开发技术上更与时俱进，将流行的功能应用起来，改变它以前那倔强的个性，不再我行我素，现在焕然一新，加入了ememt简写，开发l极其强大的extract，绝世了，可以测量，切图，取色，生成css。在前端开发框架方面，应用了bootstrap 3 ，jQuery UI 等，更注重前端的视觉设计理念，拖动进行布局界面。

其实我一开始并不开好Dreamweaver cc 13 版本，说实话，Dreamweaver cc是发展到 Dreamweaver 2014.1 开始才真正的让我接受，我认为Dreamweaver cc 13 ~Dreamweaver 2014.0 的Dreamweaver 都比Dreamweaver cs6倒退，Dreamweaver cs6的好可以和Dreamweaver 2014.1相比，之后的版本才是Dreamweaver的前进，它停滞了2年的发展，但是我觉得也因为这样的代价，才使得现在Dreamweaver 2017这么好，不然我们用Dreamweaver建站都和技术趋势相反。这种趋势就是，前端的开发从页面简单的js编写到 复杂的js编写实现更复杂的交互，界面的美观从html5出来后人们对网页美观欣赏水平上升了两个台阶，为了达到js的要求和界面美观体验的要求，衍生出了许多库和框架，Dreamweaver cs系列就是还停留在坚守原生，但是这不主流，虽然原生强大，但是更多人追求更简便，需要获得更多的用户，就需要与主流接近。强大的原生作为代码的晋级和少部分人去掌握吧，开发效率不高，不非得用Dreamweaver就得使用。

这次的Dreamweaver cc 2017并不是那么完美，我刚从Dreamweaver cc 2015.2升级上来，发现卡顿很大，我相信官方会逐渐的修复问题，新出的功能，比如快捷编辑css，less保持编译为css，这样的功能都是很有用的，还有浏览器的实时修改预览，今天更新，看到这些功能，看得我都很兴奋，迫不及待的想试试!

真希望在写代码的功能上能够赶得上sublime，但是我用了今天，我发现这样的征兆是有的，期待在未来的两个版本中可以达到sublime的写代码水平。

说到做前端，有的人用Dreamweaver 有的用 sublime等文本编辑器 的两大类工具，他们是有很大的区别I的，以后我有时间我再说说这两种的区别，我们如何使用工具。

Dreamweaver CC 2017(2016 年 11 月版)

Dreamweaver 已面向从事编码的 Web 设计人员进行了重新构建。它现在比以往任何时候更专注、高效和快速 – 具备全新代码编辑器、更直观的用户界面(含可选的黑色主题)和多种增强功能，包括对 CSS 预处理器等新工作流程的支持。

继续阅读针对上述新增功能和增强功能的快速介绍。

全新代码编辑器

已针对 Dreamweaver 中的代码编辑器提供了若干可增强工作效率的功能，以使您快速且高效地完成编码任务。

代码提示可帮助新用户了解 HTML、CSS 和其他 Web 标准，自动缩进、代码着色和可调整大小的字体等视觉辅助功能可帮助减少错误，使您的代码更易阅读。

代码提示

Dreamweaver 中的代码提示功能已得到增强，可为所选代码提供更多有用信息。

在 Dreamweaver 的早期版本中，键入一个右尖括号后，只会显示相关代码的下拉列表。

在此版本中，不仅会显示相关代码，还会显示更多有助于您快速掌握 HTML、CSS 和 Dreamweaver 自带的其他 Web 技术的信息。

增强的代码提示功能

有关详细信息，请参阅代码提示和代码补全。

代码显示增强功能

代码的整体外观已得到增强，可读性更高。您可以看到代码格式设置、代码颜色和字体大小调整方面的改进。

代码格式设置

在编写代码时，Dreamweaver 会实现代码自动缩进，以避免手动缩进错误，同时改善可读性。

代码着色

Dreamweaver 目前支持针对更多文件类型的代码着色。

代码着色支持目前适用于 HTML、JS、CSS、PHP、XML、LESS、Sass、SCSS、SVG、Bash、C、C#、C++、clojure、CoffeeScript、Dart、Diff、EJS、Embedded Ruby、Groovy、Handlebars、Haskell、Haxe、Java、JSON、Lua、Markdown、Markdown (GitHub)、Perl、属性、Python、RDF Turtle、Ruby、Scala、SQL、Stylus、文本、VB、VBScript、XML 和 YAML。

您可直接从“代码”视图中的状态栏更改不同文件类型的语法高亮显示。

字体大小调整

在不离开“代码”视图的情况下，使用以下键盘快捷键调整字体大小：

Ctrl++(Win) 或 Cmd++(Mac) 可增大字体大小

Ctrl+-(Win) 或 Cmd+-(Mac) 可减小字体大小

Ctrl+0(Win) 或 Cmd+0(Mac) 可重置为默认字体大小

有关上述所有更改的详细信息，请参阅 Dreamweaver 中的编码环境。

CSS 预处理器支持

Dreamweaver 目前支持常用的 CSS 预处理器(如 Sass、Less 和 SCSS)，提供完整的代码着色、代码提示和编译功能，可帮助您节省时间并生成更简洁的代码。

CSS 预处理器支持

有关 Dreamweaver 对 CSS 预处理器的支持的详细信息，请参阅 CSS 预处理器。

在浏览器中实时预览

无需手动刷新浏览器，即可在浏览器中快速实时预览代码更改。Dreamweaver 现已与您的浏览器连接，因此无需重新加载页面即可在浏览器中快速显示更改。

在浏览器中实时预览更改

有关详细信息，请参阅实时预览。

快速编辑相关代码文件

要快速更改代码，请将光标放在特定代码片段上并使用上下文菜单，或按 Ctrl-E(针对 Windows 系统)或 Cmd-E(针对 Mac 系统)以打开“快速编辑”功能。

Dreamweaver 会显示上下文特定的代码选项和内嵌工具。

有关详细信息，请参阅快速编辑。

无需打开多个文件或选项卡，即可快速编辑相关代码

上下文相关 CSS 文档

Dreamweaver 在“代码”视图中针对 CSS 属性提供上下文相关文档。

现在您无需从 Dreamweaver 外部访问网页即可了解或查阅 CSS 属性。要显示 CSS 帮助，请按 Ctrl+K(针对 Windows 系统)或 Cmd+K(针对 Mac 系统)。

Dreamweaver “代码”视图界面中 CSS 的快速文档帮助

有关详细信息，请参阅上下文相关 CSS 文档。

可利用多个光标编写和编辑代码

要同时编写多行代码，可使用多个光标。

此功能可以大大提高工作效率，因为您不必多次编写同一行代码。

要调用多个光标，您可以：

要在连续多行内添加光标，请按住 Alt 键，然后单击并垂直拖动。

要在不连续的多个行内添加光标，请按住 Ctrl 键，然后单击要放置光标的各个行。

要选中连续多行的文本，请按住 Alt 键并沿对角线方向拖动

要选中不连续的多行文本，请先选中部分文本，然后按住 Ctrl 键(Windows 系统)或 Cmd 键(Mac 系统)，再继续选中其余文本。

有关详细信息，请参阅使用多个光标加快编码速度。

现代化的用户界面

Dreamweaver 已经过重新设计，具备更直观的可自定义界面，更易于访问的菜单和面板，以及仅向您显示所需工具的可配置的上下文相关工具栏。

该新界面还提供从浅色到深色的四级对比度，因此更便于阅读和编辑代码行。

对菜单、工作区和工具栏的更改

此版本的 Dreamweaver 也对菜单、工具栏和工作区进行了重新设计。继续阅读以详细了解上述更改。

工作区更改

对 Dreamweaver 界面进行了优化，添加了以下默认工作区：

开发人员工作区

此工作区已最小化，默认情况下仅包括开发人员对网站进行编码时最必不可少的面板，例如“文件”面板和“代码片段”面板。

标准工作区

此工作区包括您处理代码和设计时所需的所有内容，例如“文件”、“CC 库”，“CSS Designer”、“插入”、“DOM”、“资源”和“代码片段”面板。

注意: 选择某个工作区后，您可以添加或删除面板，以进行自定义。有关自定义工作区的更多信息，请参阅创建自定义工作区。

以下是 Dreamweaver CC 2015 和 Dreamweaver CC 2017 中提供的工作区之间的差异摘要。

Dreamweaver CC 2015

新手

代码

默认值

设计

Extract

Dreamweaver CC 2017

开发人员

标准

有关工作区更改的详细信息，请参阅 Dreamweaver 工作区。

菜单更改

改进了应用程序菜单，删除了不常用的菜单项，并将其他菜单项移到了更显眼的位置。

有关 Dreamweaver 的应用程序菜单更改的详细描述，请参阅重新设计的菜单。

工具栏更改

工具栏目前在所有视图中均可见，但仅显示您正使用的视图所需的工具。

不过，您可以自定义工具栏，以显示您所需的必备工具组。

有关详细信息，请参阅工具栏概述。

状态栏更改

现在，当您在“代码”视图中工作时，状态栏会显示有用的信息。

您现在可以：

在 INS(插入)模式和 OVR(覆盖)模式之间切换

请参阅屏幕底部的行号和列号。这些编号指示您的鼠标指针所在的行和列。

为不同类型的代码文件选择所需的代码颜色。

有关详细信息，请参阅状态栏概述。

“代码片段”面板更改

“代码片段”面板不仅外观变得更为简洁，而且经过重新设计后也简化了代码片段的插入过程。

下图突出显示了“代码片段”面板中的主要更改：

“代码片段”面板中的 UI 更改

在 Dreamweaver 的早期版本中，必须使用键盘快捷键才能插入代码片段。

使用键盘快捷键插入代码片段是一种较为低效的过程，其原因如下：

需要牢记不直观的快捷键

可能与产品键盘快捷键冲突

在此版本的 Dreamweaver 中，您可以使用触发键插入代码片段。

触发键是为代码片段指定的用户友好型文本字符串。例如，对用于创建 mailto 链接的代码片段，您可以键入“mailto”并将其设置为触发键。

指定触发键后，请将光标置于文档中，键入“mailto”，并按 Tab 键。Dreamweaver 随即会将相关代码片段插入到您的文档中。

有关“代码片段”面板的更多信息，请参阅利用代码片段重复使用代码。

“文件”面板更改

对“文件”面板进行了重新设计，使之更简洁、更易于使用。

简单地说，“文件”面板将仅显示您计算机中本地文件的列表。随着您更多地使用“文件”面板来设置站点、设置到远程服务器的连接、启用存回和取出，“文件”面板中将出现更多选项。

有关“文件”面板更改的更多信息，请参阅重新设计的“文件”面板。

“欢迎”屏幕和“首次使用体验”中的更改

启动 Dreamweaver 或关闭所有 Dreamweaver 文档时会显示新的“开始”工作区。您可以在“开始”工作区方便地访问最近使用过的文件、库和起始页模板。

如果更喜欢之前的对话框，您也可以按 Ctrl/Cmd + O 启动“打开”对话框，或按 Ctrl/Cmd + N 启动“新建文档”对话框。

为帮助您快速适应 Dreamweaver CC 2017 工作区中的更改，我们为您提供了“首次使用体验”。您可以快速完成自定义体验，以找到适合您的工作区和主题选项。

有关详细信息，请参阅 Dreamweaver 工作区。

查找和替换中的实时高亮显示

全新的无干扰“查找和替换”工具栏位于窗口顶部，不会阻挡屏幕的任何部分。

总体而言，与 Dreamweaver 的早期版本相比，“查找替换”功能更加便捷且高效。现在，Dreamweaver 在您在“查找”面板中键入搜索字符串时便查找该字符串，并在当前文档中高亮显示该字符串的所有实例。

有关详细信息，请参阅查找和替换文本。

Creative Cloud 资源改进

您可以对存储在 Creative Cloud 中的所有资源(包括 Creative Cloud 库中的文件，使用 CC 桌面产品创建的资源以及移动项目)进行归档和还原，并可以添加注释和查看版本历史记录。

发生崩溃后自动恢复文件

如果 Dreamweaver 因系统错误、停电或其他问题导致意外关闭，您可以恢复对编辑中的文件所做的所有未保存更改。

有关更多信息，请参阅文档自动恢复。