• webstrom使用方法


    一、设置
    file-settings- -color&fonts设置,字体 主体 -file and code templates模板
    ctrl+r 查找,替换
    1 双击shift 快速查找
    2 file -new project 新建文件夹
    3 file-new 新建html css js等
    4 右键-local history 查看历史
    5 双击选择某个元素,alt,可以同时选择多个进行修改。
    6 code-reformat code 格式化代码 (快捷键:ctrl+alt+l)
    7 file-settings-keymap 设置 修改快捷键
    8 光标定位在末尾:ctrl+d;复制粘贴一行

    二、emmet用法:光标定位在最后,再按tab;中间不要有空格;
    1 ul>li.item-$, tab:
    2 <ul>
    <li class="item-1"></li>
    <li class="item-2"></li>
    <li class="item-3"></li>
    </ul>
    3 lorem10 tab:可以创造出10个单词

    4嵌套
    >父子
    +同级
    ^返回同级


    *多个
    ()分组
    # id
    . class
    [] 自定义属性
    {}文本

    三、注释,取消注释,操作一样
    选择代码块,ctrl+/

    四、复制粘贴
    复制多次之后
    ctrl+shift+v,选择粘贴哪个

    五、将光标定位在行中任意地方
    ctrl+shift+enter 在下方增加一行
    ctrl+alt+enter 在上方增加一行

    六、ctrl + 代码块展开
    ctrl -代码块折叠
    ctrl shift +代码全部展开
    ctrl shift -代码全部折叠

    七、找相对应的标签
    将光标定位在标签后,ctrl+[或者],就可以自动定位到相应地标签

    八crtl+shift+backspace 切换到上次编辑的地方
    ctrl+e 查看最近使用的文件

    九、预览图片:
    光标在图片路径文件夹上:shift

    十、选择颜色:
    点击左边的颜色小框

    十一、重命名,光标定位在要重命名的地方
    shift+f6


    十二、Webstorm快捷键小练习

    1、查找/替换,分为全局查找和文件内查找。
    全局查找/替换: Ctrl+Shift+N 根据键入文件名查找文件
    Ctrl+Shift+Alt+N 根据键入名字查找对象
    Ctrl+E 最近打开的文件
    Ctrl+Shift+E 最近编辑的文件


    查找/替换 匹配字符所有的位置 组合键
    Ctrl+Shift+F 打开查找窗口,键入需要查找的字符
    或Ctrl+shift+R 打开替换窗口,键入需要替换的字符
    Enter 开始查找(或Tab键切换到Find按钮,再Enter)
    或ESC 关闭查找窗口,取消查找
    Alt+3 打开Find结果窗口(Alt+3除了能打开窗口,还能
    从其他窗口切换到Find结果窗口下,然后使用上
    下键翻阅结果项即可)
    Ctrl+Shift+上下键 可调节Find结果窗口高度
    按ESC 可回到代码编辑窗口


    文件内查找/替换: 组合键
    Ctrl+F 打开文件内字符查找窗口,键入查找的字符
    Ctrl+R 打开文件内字符替换窗口,键入替换的字符
    F3或Shift+F3 在匹配的所有字符中前进或后退切换
    ESC或ReplaceAll 退出或全部替换

    2、界面操作
    Alt+菜单项首字母 即可打开该菜单列表
    Alt+[1-9] 拆合功能界面模块
    Alt+7 界面元素大纲
    Alt+5 debug界面
    Alt+4 Run界面
    Alt+3 Find结果界面
    Alt+1 Project界面
    Ctrl+Shift+F12 最大编辑界面(Ctrl+Shift+F9/Shift+F9 -
    debug;Ctrl+Shift+F10/Shift+F10 -Run)

    打开文件,切换文件,关闭文件标签页 组合键
    Alt+1 鼠标焦点切换到Project界面下
    上下键 按上下键选择文件
    Enter 打开文件Tab页
    Alt+左右方向键 在多个文件Tab页间切换
    Ctrl+F4 关闭当前Tab页(Alt+F4关闭Webstrom)

    3、代码编辑 组合键
    Esc 切换焦点到编辑界面下

    (定位)
    Ctrl+G 输入行好,定位光标到某行
    home/end 定位光标到行首/行尾
    Ctrl+home/end 定位光标到文件首行或者末行
    Ctrl+左右方向键 已单词为步长在一行内移动
    Ctrl+W 选择某个单词


    (编辑)
    Ctrl+Alt+Enter/Enter在行前新建一行/或行后另起一行,键入代码
    Ctrl+X 删除一行
    Ctrl+D 复制一行
    Ctrl+Z 撤销
    Ctrl+shift+Z 还原

    (查看)
    Ctrl+B 进入方法体
    Ctrl+Alt+右方向键 退出方法体
    Ctrl+[-/+] 收缩/展开方法体
    Ctrl+Shift+[-/+] 全局收缩/展开方法体

    十三、javascript标签到底是应该放在头部还是尾部
    按照惯例,所有<script>元素都要放在页面的<head>元素中。如:

    <html>
    <head>
    <script type="text/javascript" scr="example.js"></script>
    </head>
    <body>
    </body>
    </html>
    这种做法就是把所有的外部文件(包括CSS和JS)的引用都放在相同的地方。可是文档的<head>包含所有JavaScript文件则意味着必须等到所有JavaScript代码下载、解析、执行完以后才呈现网页的内用,这无疑会导致浏览器在呈现页面时出现明显的延迟,为了避免这个问题,现代Web应用程序一般全部JavaScript放到<body>元素中。

    <html>
    <head>
    </head>
    <body>
    <script type="text/javascript" scr="example.js"></script>
    </body>
    </html>

    十四、去电点击时出现的虚线框
    a:focus{outline:none;}

  • 相关阅读:
    【AHOI2009】 维护序列
    Codeforces Hello 2019 F. Alex and a TV Show[bitset+莫比乌斯反演]
    Codeforces Hello 2019 D. Makoto and a Blackboard[DP+数论+概率期望]
    Codeforces Hello 2019 ABCDF题解
    [BZOJ1042][HAOI2008]硬币购物[容斥原理+背包]
    Codeforces Round #529 (Div. 3)题解
    [BZOJ4311]向量[线段树分治+计算几何+二分/三分]
    [BZOJ1076][SCOI2008]奖励关[状压DP+概率期望]
    [POJ3368][UVA11235] Frequent values[ST表]
    [USACO5.5]矩形周长Picture[扫描线+线段树]
  • 原文地址:https://www.cnblogs.com/annie211/p/6083269.html
Copyright © 2020-2023  润新知