美文网首页
工欲善其事_必先利其器——WebStorm使用基础之最常用快捷键

工欲善其事_必先利其器——WebStorm使用基础之最常用快捷键

作者: 八步里 | 来源:发表于2018-07-29 14:55 被阅读0次
  1. 开发工具的选择

  • 轻量级——Sublime Text(编辑器)
  • 重量级——WebStorm(IDE)
    webstrom是jetbrains公司旗下一款JavaScript 开发工具,对JavaScript有较好的支持,被称为Web前端开发神器。除此两款软件外还有Adobe Dreamweaver(IDE)也是不错的选择
  1. WebStorm下载安装(具体操作百度搜索关键词

选择自己电脑相应的版本
该软件需要JDK(Java的开发环境和运行环境)的支持,注意添加JDK的系统环境
JDK
WebStorm
  1. WebStorm标签输入快捷键

  • 注释:光标所在行 ctrl+/ 可以自动注释和撤销注释
  • 标签补齐:
  • 不加修饰的标签(如单独的h1标签):完整的h1标签,只需要敲h1,按tab键<h1></h1>
  • 具有id的标签:div#abc,按Tab键<div id="abc"></div>
  • 具有class的标签:div.abc,按Tab键<div class="abc"></div>
  • 输入的标签内部还有标签的可以用>号包裹子标签(仅仅以div和p标签举例,下同),div>p,按 Tab键:
    <div><p></p></div>
  • 输入多个相同的标签用p*3,按 Tab键:
    <p></p>
    <p></p>
    <p></p>
  • 特定属性标签补齐:a[href=#],按Tab键:
    <a href="#"></a>(#是代表你所指定具体的属性)
  • 写下标签时顺便写入标签的内容:a{p},按Tab键::
    <a href="">s</a>
    多个相同的带有顺序序列的标签:
    带序号测试

这些快捷标签输入形式可嵌套使用:

    ul>li*3>div.img>img[src=images/$.jpg]
    <ul>
        <li>
            <div class="img"><img src="images/1.jpg" alt=""></div>
        </li>
        <li>
            <div class="img"><img src="images/2.jpg" alt=""></div>
        </li>
        <li>
            <div class="img"><img src="images/3.jpg" alt=""></div>
        </li>
    </ul>

  1. 其他快捷键*(经过筛选)*

  • 代码格式进行自动对齐
    选中需要对其的的代码,然后CTRL+ALT+L
  • 打开工程中的文件:
    ctrl + shift + n
  • 剪切(删除)行:
    ctrl+x
  • 替换:
    ctrl + r
  • 查找:
    ctrl+f
  • 块移动:
    ctrl + shift + up
  • 行移动:
    shift + alt + up
  • 行复制:
    ctrl + d
  • 单行注释:
    ctrl + /
  • 可填注释:
    ctrl + shift+/
  • 展开/折叠代码:
    ctrl+shift+ +/-
  • 高亮所选文本:
    Ctrl+Shift+F7 (Esc取消)
  • 逐个往下查找相同文本:
    Alt+F3
  • 选中所有查找的内容:
    ctrl + shift + alt + j

相关文章

  • 工欲善其事_必先利其器——WebStorm使用基础之最常用快捷键

    开发工具的选择 轻量级——Sublime Text(编辑器) 重量级——WebStorm(IDE)webstrom...

  • Android Studio 快捷键

    工欲善其事,必先利其器,Android Studio编程当然要熟练使用其快捷键了!总结一些常用的快捷键,多图预警!...

  • Android Stuido 常用快捷键

    工欲善其事,必先利其器。 针对常用的AS快捷键,做了梳理和总结,其中加星标的是推荐尝试使用的。

  • IntelliJ IDEA 技巧

    工欲善其事,必先利其器。熟练使用 IDE 的各种技巧和快捷键开发,你会感到各种酸爽。 快捷键 按导航栏分类介绍常用...

  • 小程序常识

    “工欲善其事,必先利其器” 常用快捷键 光标 Ctrl + End : 移动到文件结尾 Ctrl + Home :...

  • WebStorm常用快捷键

    WebStorm常用快捷键 1、查找/代替 Webstorm快捷键Eclipse快捷键说明 ctrl+shift+...

  • 高效Android Studio——快捷键

    工欲善其事必先利其器 常用快捷键 Ctrl + J Live Templates 当然你可以在 File-> S...

  • Xcode快捷键你知多少?

    常言道,工欲善其事必先利其器。 了解xcode常用快捷键在coding中的使用,很容易摆脱鼠标的拖累,大大提高co...

  • Android Gradle详解

    工欲善其事,必先利其器。首先说一下AndroidStudio在Mac下的常用快捷键。 什么是Gradle? Gra...

  • WebStorm 快捷键及自定义

    善用快捷键开发效率会很快。WebStorm我的比较有用的快捷键 常用快捷键 WebStorm 自定义快捷键

网友评论

      本文标题:工欲善其事_必先利其器——WebStorm使用基础之最常用快捷键

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