注:目前暂不支持 DW CC,期待作者早是更新。Update:2013/10/12

鉴于某些原因,每个 Coder 所钟爱的 IDE 各不相同。而作为一个软件爱好者,我几乎所有 IDE 都使用过一段时间,目前是 Dreamweaver + Sublime Text 2 共用。不过不管你是普通的 Notepad++,文艺的 Sublime Text,还是二逼的Dreamweaver,甚至装逼的 Vim,有些插件总是必不可少的,例如大名鼎鼎的 zencoding(目前已改名 Emmet,并且很好的支持 DW)。

Emmet 是一款快速编写 HTML/CSS 的工具,例如输入:

ul.nav>li>a.n_$*6

然后按下快捷键 Ctrl+E,即可生成如下一段代码:

<ul class="nav">
<li>
<a href="" class="n_1"></a>
<a href="" class="n_2"></a>
<a href="" class="n_3"></a>
<a href="" class="n_4"></a>
<a href="" class="n_5"></a>
<a href="" class="n_6"></a>
</li>
</ul>

看了这些代码是不是已经蠢蠢欲动了,更多规则可在文末下载附件查看。接下来谈谈 DW 如何安装这款插件。首先你要确定你的DW已经装上了扩展管理器(Extension Manager),如何没有的话可以重新在安装DW时不要去掉扩展管理器前面的勾,或者到Adobe官网下载>>http://www.adobe.com/exchange/em_download/

如果你已经安装的扩展管理器,只须要下载Emmet的DW插件http://download.emmet.io/dreamweaver/Emmet.zxp,双击进行安装,看到提示后继续一步步下去,直到成功。如果此时提示菜单没有更新成功,则打开以下路径C:\Users\Administrator\AppData\Roaming\Adobe\Dreamweaver CS6\zh_CN\Configuration\Menus(Win7/Dw CS6),找到该目录下的 menus.xml 重新命名备份(例如menus.xml_bak),接着重新进行安装。

注:解析 Emmet 规则默认是 Ctrl+E 不过由于 DW 自身快捷键太多,重复了。此时打开【编辑】-【快捷键】,然后选择 Dreamweaver Standard,接着再点击右边第一个按钮复制副本,名称随意。

然后再找到【菜单命名】下的【插入】,将【标签】的快捷键修改为其它,例如 Ctrl+R。

至此,你可以大胆的在 DW 中使用 Emmet了。不过 Emmet for DW 默认没有设置其它操作的快捷键,所以你也可以按这些操作,设置上一个编辑点,下一个编辑点等快捷键。这样就能够放弃鼠标更好的在代码快中的位置切换。

相关链接:

让 Dreamweaver 支持 Emmet(原ZenCoding)的更多相关文章

  1. sublime text3 Emmet (原zenCoding)安装方法

    1.安装使用Package Control组件安装 (1)打开控制台 (mac)control+`; (win)ctrl+` (2)复制一下代码并回车 import urllib.request,os ...

  2. atom中vue高亮支持emmet语法

    vue高亮插件: language-vue 支持emmet语法: 文件>用户键盘映射>keymap.cson添加: 'atom-text-editor[data-grammar~=&quo ...

  3. 让Dreamweaver支持cshtml (MVC Razor环境)

    介绍:让Dreamweaver支持cshtml 正文: 如题,刚才搜了很久,都搜不到答案,幸好得到“包大人”(同事)的帮助,才得以解决. DW支持很多文件类型的代码提示,可是类型太多,不可能全部都有, ...

  4. 在Dreamweaver中安装Emmet(zen-coding)

    在http://www.adobe.com/exchange/em_download/地址下下载好Emmet扩展插件,然后在Dreamweaver找到菜单栏中命令>扩展管理>文件,找到以后 ...

  5. Sublime Text3中JSX支持Emmet快捷键

    在复习React的过程中,发现Sublime有些快捷键不能用了,如Emmet的Tab快速生成HTML代码只能用Ctrl+E快捷键,而不能用Tab键了,在网上找了很多文章,发现都有问题,最终自己通过下面 ...

  6. 让Dreamweaver支持less

    编辑->首选参数->文件类型/编辑器->在代码视图中打开->添加" .less"后缀

  7. Dreamweaver 支持Jquery智能提示

    a.下载扩展插件:jQuery_API.mxp b.选择菜单栏:命令->扩展管理,选择刚下载的文件安装 c.重启DW 可以看到

  8. sublime text2一些使用技巧+插件

    一.前言 作为一个前端,有一款好的开发利器是必不可少的,editplus.notepad++都是不错的工具,体积轻巧,启动迅速(dw太浮肿了).最近,又有一款新的编辑器诞生,席卷前端界,惹得无数喜爱, ...

  9. 如何在“代码”视图中工作并充分利用 Dreamweaver 的编码功能。如 Emmet 缩写

    可通过多种方式在 Dreamweaver 中处理代码. 您可以使用“新建文档”对话框打开新的代码文件,然后开始键入您的代码. 在 Dreamweaver 中创建新的代码文件 键入时,会显示代码提示以帮 ...

随机推荐

  1. N3292系列资料之RTC介绍

    N3292系列资料之RTC介绍 1 RTC特性 Ø 拥有时间计数器(秒,分,时)和日历计数器,用来计算时间 Ø 绝对定时功能(秒,分,时,日,月,年) Ø 相对定时功能 Ø 支持12小时/24小时模式 ...

  2. SQLAlchemy入门

    什么是SQLAlchemy? 是Python连接SQL数据库的一种方式,需要通过驱动来连接. 是Python中使用最广泛的ORM(对象关系映射)工具之一,即把数据库中的二维表结构映射成一个list对象 ...

  3. forward和redirect

    Forward和Redirect代表了两种请求转发方式:直接转发和间接转发. 直接转发方式(Forward),客户端和浏览器只发出一次请求,Servlet.HTML.JSP或其它信息资源,由第二个信息 ...

  4. Java 中的日期与时间

    Java 日期时间 标签 : Java基础 Date java.util.Date对象表示一个精确到毫秒的瞬间; 但由于Date从JDK1.0起就开始存在了,历史悠久,而且功能强大(既包含日期,也包含 ...

  5. postgresql总结

    这篇博客主要对PostgreSQL进行总结,内容偏基础. 这里先附上一个PostgreSQL的中文资源:PostgreSQL 8.1 中文文档.英文不好的同学可以看看这个. 安装PostgreSQL ...

  6. 学习windows编程 day3 之 自定义画笔的两种方法

    LRESULT CALLBACK WndProc(HWND hwnd, UINT message, WPARAM wParam, LPARAM lParam) { HDC hdc; PAINTSTRU ...

  7. 微信公众号 几种移动端UI框架介绍

    微信公众号开发,主要是移动端网页的页面开发,在这里推荐3个移动端UI框架:WeUI.SUI和Mint UI. 1. WeUI 1.1 WeUI WeUI是微信官方设计团队为微信 Web 开发量身设计, ...

  8. 常见的local variable &#39;x&#39; referenced before assignment问题

    def fun1(): x = 5 def fun2(): x *= 2 return x return fun2() 如上代码,调用fun1() 运行会出错:UnboundLocalError: l ...

  9. Windows系统下安装zip命令

    从GnuWin32 项目页面 上下载并安装 zip 命令 添加环境变量到系统中,即将安装目录添加至你的系统的 Path环境变量中( 假设安装目录时D:\Program Files (x86)\GnuW ...

  10. MD5加密和彩虹表

    首先叙述一下彩虹表的原理.本部分内容.图片和例子基本来自英文维基的Rainbow table词条(Rainbow table)——中文维基中目前(2013年10月9日)尚无对应的词条——因此对本答案中 ...