精华内容
下载资源
问答
  • webstorm快速输入标签
    2020-09-14 10:33:30
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>webstorm快键键</title>
    
    
         <!--引入  link   加tab键-->
        <link rel="stylesheet" href="">
    
        <!--引入css   link:css   加tab键 -->
        <link rel="stylesheet" href="css/mycss.css">
    
        <!--引入js    script:src  加tab键-->
        <script src=""></script> 
    
        <!--html中插入js   script  加tab键-->
        <script></script>
    
    </head>
     
    <body>
     
    <!--
    正常情况:
    先输入:<h1
    再输入:>
     -->
    <h1></h1>
     
    <!--
    >:下一个子标签
    *:多少个标签
    $:标签的名称序号
    {}:标签的内容
    -->
     
    <!--输入:h1,按tab键-->
    <h1></h1>
     
    <!--输入:div#abc,按Tab键-->
    <div id="abc"></div>
     
    <!--输入:div.abc,按Tab键-->
    <div class="abc"></div>
     
    <!--输入: div>p*6 ,按Tab键-->
    <div>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
    </div>
     
    <!--输入 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>
     
    <!--输入  ul>li*5>a[href=#]{我是第$个} 再按tab键-->
    <ul>
        <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>
    
    <!--ul及1个li     ul+     -->
    <ul>
        <li></li>
    </ul>
    
    <!--ul及3个li     ul>li*3     -->
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
     
    <!--输入 img[src='images/$.jpg']*3 再按tab键-->
    <img src="images/1.jpg" alt="">     
    <img src="images/2.jpg" alt="">     
    <img src="images/3.jpg" alt="">
     
    <!--输入 li*3>div.img>img[src='images/$.jpg'] 再按tab键-->
    <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>
     
    
    + : 并列的标签
    <!--div#tab1+div#tab2-->
    
    <div id="tab1"></div>
    <div id="tab2"></div>
    
    <!--    a:link  -->
    <a href="http://"></a>
    
    <!--input:button 加tab键-->
    <input type="button" value="">
    
    <!--div.one.two-->
    <div class="one two"></div>
    
    <!--form:get-->
    <form action="" method="get"></form>
    <!--form:post-->
    <form action="" method="post"></form>
    
    <script>
         /* for循环:输入itar,再点击tab键*/
         for (var i = 0; i < array.length; i++) {
             var obj = array[i];
    
         }
    </script>
    </body>
    </html>
    </body>
    </html>

     

    更多相关内容
  • WebStorm快速输入

    2020-04-06 10:23:21
    WebStorm快速输入 下文+tab表示光标输入内容后按tab键,每个示例可以相互组合使用 一、快速输入标签 1.1、快速输入基本标签 div+tab <div></div> 1.2、快速输入带内容标签 p{这是内容} <p>这是...

    WebStorm快速输入

    下文+tab表示光标输入内容后按tab键,每个示例可以相互组合使用

    一、快速输入标签

    (一)快速输入基本标签

    div+tab

    <div></div>
    

    (二)快速输入带内容标签

    p{这是内容}

    <p>这是内容</p>
    

    (三)快速输入多个标签

    span+p+tab

    <span></span>
    <p></p>
    

    (四)快速输入嵌套标签

    ul>li+tab

    <ul>
        <li></li>
    </ul>
    

    二、快速输入标签带属性

    (一)快速输入带类名标签

    div.class_name+tab

    <div class="class_name"></div>
    

    (二)快速输入带ID标签

    div#id_name+tab

    <div id="id_name"></div>
    

    (三)快速输入带属性标签

    img[src=“logo.png”,alt=""]+tab

    <img src="logo.png" alt="">
    

    三、批量生成

    (一)批量生成标签

    div*2+tab

    <div></div>
    <div></div>
    

    (二)批量生成嵌套标签

    ul*2>li*2

    <ul>
        <li></li>
        <li></li>
    </ul>
    <ul>
        <li></li>
        <li></li>
    </ul>
    
    展开全文
  • webstorm快捷输入html代码 使用webstorm时,使用以下方法可以更高效的码代码,来自搬运,作为一个成长记录,希望对你们有用,一起来看看吧。 <!DOCTYPE html> <html lang="en"> <head> <meta ...

    webstorm快捷输入html代码

    使用webstorm时,使用以下方法可以更高效的码代码,来自搬运,作为一个成长记录,希望对你们有用,一起来看看吧。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>webstorm快键键</title>
    </head>
     
    <body>
     
    <!--
    正常情况:
    先输入:<h1
    再输入:>
     -->
    <h1></h1>
     
    <!--
    >:下一个子标签
    *:多少个标签
    $:标签的名称序号
    {}:标签的内容
    -->
     
    <!--输入:h1,按tab键-->
    <h1></h1>
     
    <!--输入:div#abc,按Tab键-->
    <div id="abc"></div>
     
    <!--输入:div.abc,按Tab键-->
    <div class="abc"></div>
     
    <!--输入: div>p*6 ,按Tab键-->
    <div>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
    </div>
     
    <!--输入 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>
     
    <!--输入  ul>li*5>a[href=#]{我是第$个} 再按tab键-->
    <ul>
        <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>
     
    <!--输入 img[src='images/$.jpg']*3 再按tab键-->
    <img src="images/1.jpg" alt="">     
    <img src="images/2.jpg" alt="">     
    <img src="images/3.jpg" alt="">
     
    <!--输入 li*3>div.img>img[src='images/$.jpg'] 再按tab键-->
    <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>
     
    </body>
    </html>
    
    展开全文
  • webstorm 快捷输入自定义模板总结

    千次阅读 2018-12-24 19:51:00
    修改方法 打开"设置"(Ctrl + Alt + S) 模板 console.log() 插入式 console.log($PARAN$); 包围式 选中被包围的内容按 Ctrl + Alt + J console.log($SELECTION$); function() {} ......

    修改方法

    打开"设置"(Ctrl + Alt + S)


    4804567-cb0c46599e1a3464.png

    模板

    console.log()

    • 插入式
    console.log($PARAN$);
    
    • 包围式
      选中被包围的内容按 Ctrl + Alt + J
    console.log($SELECTION$);
    

    function() {}

    function($MODULE_VAR$) {
    $END$
    });
    

    alert()

    alert($PARAN$);
    

    ajax

    $.ajax({
        url: '$PARAN$',
        data:{},
        type: 'post',
        dataType: 'JSON',
        success:function(res) {}
    });
    

    axios

    axios.get(``, {}).then(res => {
        console.log(res);
    }, rej => {
        console.log(rej);
    }).catch(err => {
        console.log(err);
    });
    
    展开全文
  • webstorm快速输入标签 Webstorm的一些常用快捷键 Shift + Enter 另起一行(无论光标在哪个位置) Ctrl+Enter 在下一行插入新行。只能是光标在末尾的时候。才对。否则就是换行 shift+alt 出现光标,往下拉可以选中...
  • 意思就是打完快捷输入后按tab键 例子: 语法五:最后来个嵌套多的。(细品,你细品就会发现很多时候都会用到。) #page>div.logo+ul#nav>li*5>a{Item $} <div id="page"> <div class=...
  • webstorm中常用的快速输入标签

    千次阅读 2018-10-12 19:04:25
    参考: 前端学习总结(二十)那些你可能不知道却强大方便的WebStorm快捷键 webstorm批量编辑快捷键【跳转到指定行,批量输入】 Intellij idea 快捷键(1)–生成for循环代码块 WebStorm快捷键收集 &lt;!...
  • 参考: ... 正常情况: 先输入标签名,然后按tab即可 比如: div+tab ==》生成:<div></div> 如果想生成多个div: div*3+tab==> <div></div> <div...
  • webstorm快捷键

    2021-12-15 11:27:56
    下面是Webstorm的一些常用快捷键: 1. ctrl + shift + n: 打开工程中的文件,目的是打开当前工程下任意目录的文件。 2. ctrl + j: 输出模板 3. ctrl + b: 跳到变量申明处 4. ctrl + alt + T: 围绕包裹代码(包括zen...
  • HTML-webstorm添加快捷键

    2021-06-12 17:08:20
    快速输入标签:先输入标签p,按Tab键变成输入内容后按end键快速复制粘贴光标所在的一整行内容Ctrl+D快速删除光标所在的行 Ctrl + X快速用标签包裹一段内容:选中文本后按Ctrl + Alt + T,在弹出的选项中选择标签包裹让...
  • WebStorm自定义快捷注释 一.点击File,找到Settings,搜索Live Templates,选中需要在那个模块下生成,然后点击加号,添加快捷生成代码 二.Abbreviation填写你要生成的快捷代码,如下图都选择Enter(输入//,按Enter生成...
  • 将.tar.gz解压,将其里边的***.desktop移动至/usr/share/applications/ 例如eclipse的快捷方式mv eclipse.desktop /usr/share/applications/
  • Webstorm10 快速插入当前时间

    千次阅读 2019-02-01 15:29:11
    Webstorm中通过自定义Live Template可以快速插入当前时间 首先在设置中,Editor → Live Template,点击添加模板 填写如下信息: Abbreviation,在编辑器中输入的可以出发插入模板的缩写字符,这里填写datetime ...
  • webstorm模板快速生成

    2021-01-07 16:44:37
    前言 我们在使用webstorm开发项目的时候,有时会重复写多个很相似的代码块,经常要从别的代码处复制粘贴后修修改改。那么能不能将这些重复经常写的代码块抽象...3、添加模板,输入你要取的快捷名,模板介绍等等。...
  • 输入标签,然后按Tab键,无需输入尖括号<> . 其他指令也类似,用tab键来启动自动生成代码指令. 示例: 输入div按tab键,自动出现 <div></div> 一、手机端页面适配快捷键 输入: meta:vp 再按tab键就...
  • https://blog.csdn.net/weixin_43606158/article/details/90900061 转载于:https://www.cnblogs.com/cazj/p/11287447.html
  • 非常方便,对于常用的代码进行补齐 操作步骤链接:here

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,853
精华内容 1,541
关键字:

webstorm快捷输入