美文网首页
WebStorm快捷键

WebStorm快捷键

作者: lueyoo | 来源:发表于2018-05-11 16:46 被阅读0次
  • 1 自动注释和撤销注释:ctrl+/

    在一句代码前面用 ctrl+/ 可以自动注释和撤销注释,js,html都
    可以,很好的省去了敲注释符的时间 (mac下为command+/,下同)

  • 2 自动补全html标签

    我们知道在使用linux命令的时候按tab键有自动补全的功能,在很多编译器里也是,在webstorm中当 你想敲一些html元素时,比如:

(1)想敲一对h1标签,只需要敲h1,按tab键,变回自动补全为:<h1></h1>

(2)想输入带id的,如<div id="abc"></div>只需要输入:div#abc,按Tab键,便会自动补全。

(3)想输入带class的,如 <div class="abc"></div>只需要输入:div.abc,按Tab键,便会自动补全。

(4)想输入一个div里有6个p标签,只需要输入: div>p*6 ,按Tab键,便会自动补全为:

   <div>
        <p></p>

        <p></p>

        <p></p>

        <p></p>

        <p></p>

        <p></p>
</div>

(5)特定属性的标签的补全:

a[href=#] tab后:
<a href="#"></a>

ul.menu>li*6>a[href=#]{HTML}
tab后补全为:

<ul class="menu">
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
</ul>

更多代码简写补全的技巧可以参考:
http://blog.wpjam.com/m/emmet-grammar/
http://www.w3cplus.com/tools/emmet-cheat-sheet.html
http://www.ruanyifeng.com/blog/2013/06/emmet_and_haml.html

  • 3 自动整理代码格式进行对齐

选中要整理的代码

windows:
CTRL+ALT+L

Mac
command+option+L

  • 4 寻找代码片段

    有时候我们需要寻找一些特定的样式或函数,只需要右键要寻找的目录,选择 find in path,输入要寻找的内容,webstorm就会自动寻找所有包含该内容的文件了。

  • 5 寻找代码定义位置

    很多时候我们想查找某个函数或者变量定位的位置,按住command(ctrl)键,点击要查找的内容,webstorm就会自动跳转到它定义的地方了,这个方法能够很好的提高开发和阅读代码的效率。

  • 6 大小写转化

    有时候需要快速的把一段字母转成全大写或全小写,只需要使用:
    Command(ctrl)+shift+U

  • 7 全局查找
    双击 shift

  • 8 查找最近打开的文件

    Ctrl + E

    更多webstorm快捷功能参考:
    webstorm那些好用的特性:
    http://blog.allenice233.com/2014/06/23/webstorm%E9%82%A3%E4%BA%9B%E5%A5%BD%E7%94%A8%E7%9A%84%E7%89%B9%E6%80%A7/

相关文章

网友评论

      本文标题:WebStorm快捷键

      本文链接:https://www.haomeiwen.com/subject/piofdftx.html