(转)在Dreamweaver中使用emmet

http://www.zhangxinxu.com/wordpress/?p=3666

Dreamweaver中安装emmet

我目前使用的是Dreamweaver CS6, 所以，就以这个版本举例示意。至于其余版本是否是也是这样，就不知道了，扫瑞啊~~

官方下载
下载去官方，及时又可靠，轻轻地地点击这里：http://emmet.io/download/ 或者直接狠狠地点击这里：Emmet.zxp

若是你已经安装了Adobe的Extension Manager(扩展管理器)，直接双击安装就能够啦！若是木有，点击这里下载。

一路“是”和“接受”到底（忽略某认证警告），而后，就装好啦！重启，over~

3、emmet在Dreamweaver中的使用

此时，咱们兴高采烈地新建一个HTML文档，用激动而颤抖的双手敲下：

div#test>ul.nav>li>a*5

而后，大手一扬，泰山压顶之势按下Tab键，因而，当当当当……

……屁效果都木有——

为何木有效果呢？

虽说不少事情你想不通的时候，照照镜子就能明白。可是，此次，真不是镜子能解决的。

咱们查看下排版相关快捷方式，哈哈，原来默认不是Tab, 而是Ctrl+E啊！

因而，再次，兴高采烈地，用激动而颤抖的双手敲下：

div#test>ul.nav>li>a*5

而后，眼睛像盯着女神的胸同样盯着Ctrl+E键，并按下。满心期待抬起头，看到的是，当当当当……

……这是哪根葱啊？

标签选择器，哦，no! 说好的HTML生成呢？

一研究，发现，快捷键冲突了，Ctrl+E快捷键是Dreamweaver默认的标签选择器弹框快捷键，该死！怎么破？很简单，给emmet从新找个快捷键。

以下step：

1. Edit → Keyborad Shortcuts…
   
2. 打开的面板中，一次展开：Commands → emmet，而后选中Expand Abbreviation，以下图所示：
   
3. 在下面的空白框框focus, 而后按下Ctrl+/ ,以下图所示（我我的喜欢Ctrl+/，您能够定义本身喜欢的快捷键哦），而后点击change按钮，再点击OK：
   
4. over~

下面，咱们怀揣着平静地心情，copy下面这一段字符：

div#test>ul.nav>li>a*5

而后，有气无力地按下Ctrl+/, 弱弱地抬起眼皮，看着死板的屏幕，结果……

我了个擦！竟然立马大阅兵的节奏，排排站了！

撒花，鞭炮！喜出望外~

可是，有人可能要耸肩了：“我喜欢Tab键触发，我就是喜欢，我就是习惯”，你这个……不来赛（沪语）~

(*^__^*) 嘻嘻……尊敬的顾客，您要的商品“Tab触发”已经发货，请注意阅读下面的文字进行查收：

1. 在任意编辑器任意位置，写下以下三个字母 – Tab, 而后复制到剪切板上；
2. Edit → Keyborad Shortcuts…
   
3. 打开的面板中，一次展开：Commands → emmet，而后选中Expand Abbreviation，以下图所示：
   
4. 在下面的空白框框focus, 而后右键粘贴，以下图所示：
   
   
5. 点击change，点击ok，over~

下面，试探性地书写以下内容：

div#test>ul.nav>li>a*5

而后，满怀但愿地按下Tab键，哇哦，眼前一亮……

效果出来啦！

撒花，鼓掌，眼泪横飚！

可是别高兴地太早，虽然emmet展开管用了，可是，本来Tab的缩进效果木有了哈！所以，间距，只能使用空格了呵，嚒嚒酱！本身权衡哈~