Dreamweaver CC教程:快速编辑代码
快速编辑
Dreamweaver 中的“快速编辑”模式可放置上下文特定的内联代码和工具,可让您快速获取所需的代码片段,而不是在编码环境中放置大量面板和图标。
可通过以下方式进入“快速编辑”模式:
使用“快速编辑”模式处理 HTML 文件
在 HTML 文件中,将光标置于类或 ID 属性(名称或值)内或标签名称中。“快速编辑”将向您显示项目中匹配的所有 CSS、SCSS 和 LESS 规则。您可以甚至在不退出 HTML 文件上下文的情况下以内联方式直接编辑这些规则。
使用“快速编辑”模式处理 HTML 文件
当多个规则匹配时,使用右侧列表(或使用 Alt-向上/向下键)在它们之间进行导航。
若要在内联编辑器中直接创建 CSS 规则,请单击“新建规则”或按 Ctrl-Alt-N(在 Windows 上)或 Cmd-Opt-N(在 Mac 上)。
使用“快速编辑”模式处理 JavaScript 文件
在 JavaScript 文件中,将光标置于函数名称上。“快速编辑”将向您显示函数的主体(即使函数存在于由 require() 语句引用的其他文件中)。
使用“快速编辑”模式处理 JavaScript 文件
使用“快速编辑”模式处理 CSS、SCSS 或 LESS 文件
如果当光标在颜色值中时显示“快速编辑”,则可以访问拾色器并快速修改在 CSS 代码中使用的颜色。
在 CSS 文件中访问拾色器
在 CSS、LESS 或 SCSS 文件中,将光标置于 cubic-bezier() 或 steps() 过渡计时函数上,“快速编辑”将显示图形过渡曲线编辑器。
预定义的计时函数 ease、ease-in、ease-out、ease-in-out、step-start 和 step-end 也是有效的起始点。
使用“快速编辑”操作贝赛尔曲线