emmet语法和sublime,webstorm快捷键

常用emmet语法：

（emmet为前端开发十分强大的插件，编写代码更快更便捷，强烈推荐）

! + tab = 生成html5结构（或者是html:5+ tab）

.abc$*3 + tab =  (id等同理，将.改成#)

<div class="abc1"></div>
<div class="abc2"></div>
<div class="abc3"></div>

ul.myclass>(li>a[href="#"]{我是链接$})*5 +tab =

<ul class="myclass">
      <li><a href="#">我是链接1</a></li>
      <li><a href="#">我是链接2</a></li>
      <li><a href="#">我是链接3</a></li>
      <li><a href="#">我是链接4</a></li>
      <li><a href="#">我是链接5</a></li>
 </ul>

其中[]为设置属性。

h200 + tab = 

height: 200px;

tac + tab = 

text-align: center;

  

bd+ +  tab = 

border: 1px solid #000;

sublime一些快捷键：

ctrl +}：选中所有行进行缩进

shift +鼠标右键(连续几行) /ctrl + 鼠标左键(可自选行): 选中多行同时编辑

ctrl + shift + G = 将选中的一段文字添上标签(可用于嵌套)

ctrl + shift + p: 打开命令模式（可以设置目前文件类型setsyntax:javascript，简写输入js即可），主要目的是为了执行某个命令，因为可能忘了快捷键不知如何执行。

ctrl +p: goto快速找到需要的文件（test\index.html）   加@快速定位到当前文件某一选择器（css）或某一函数（js）；  加#对页面中的标记或关键字等进行寻找；  :20命令表示跳转到第20行

菜单中“编辑”详细介绍了sublime对编辑区的一些快捷键操作，还有“选择”中常用的：选中某一行（ctrl+L）；  选中鼠标所在的单词并显示文件中所有（前提：非用户定义）相同的单词（ctrl+D），继续按ctrl+D选中下一个单词…可以此进行多个单词替换。Alt+F3:直接全部选中。

“查找”菜单：   替换功能find&replace：ctrl+H

还有其他快捷键，总之，详见菜单即可。

webstorm快捷键：

（之后都用webstorm了，以后开发大型项目webstorm更合适，而且写代码也有智能提示错误，就是占用内存较大）

ctrl + alt + L : 调整当前整个页面的代码格式

如：

for(var i=0;i<10;i++){
}

则会变成：

for (var i = 0; i < 10; i++) {
}