精华内容
下载资源
问答
我要提问
  • 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

  • webstorm快捷输入html代码

     2021-03-06 14:07:54
    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>
    收起
    展开全文
    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快速输入标签 tab快速构建页面 使用技巧

     千次阅读 2018-12-23 11:05:27
    webstorm快速输入标签 Webstorm的一些常用快捷键 Shift + Enter 另起一行(无论光标在哪个位置) Ctrl+Enter 在下一行插入新行。只能是光标在末尾的时候。才对。否则就是换行 shift+alt 出现光标，往下拉可以选中...
    收起

  • Webstorm快捷输入Emmet简单语法

     2021-02-05 11:29:24
    意思就是打完快捷输入后按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;!...
    收起

  • webstorm&vs code快速输入标签快捷键快速生成class id等

     千次阅读 2019-08-02 09:53:59
    参考： ... 正常情况： 先输入标签名，然后按tab即可 比如： div+tab ==》生成：<div></div> 如果想生成多个div： div*3+tab==> <div></div> <div...
    收起
    vscode html html5

  • webstorm快捷键

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

  • HTML-webstorm添加快捷键

     2021-06-12 17:08:20
    快速输入标签：先输入标签p,按Tab键变成输入内容后按end键快速复制粘贴光标所在的一整行内容Ctrl+D快速删除光标所在的行 Ctrl + X快速用标签包裹一段内容：选中文本后按Ctrl + Alt + T,在弹出的选项中选择标签包裹让...
    收起

  • WebStorm自定义快捷注释

     2021-03-19 10:26:44
    WebStorm自定义快捷注释 一.点击File,找到Settings,搜索Live Templates,选中需要在那个模块下生成,然后点击加号,添加快捷生成代码 二.Abbreviation填写你要生成的快捷代码,如下图都选择Enter(输入//,按Enter生成...
    收起
    javascript

  • fedora下idea，eclips，webstorm快捷方式*.desktop

     2018-03-10 09:59:27
    将.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、添加模板，输入你要取的快捷名，模板介绍等等。...
    收起

  • WebStorm代码快捷《控制代码输入》

     2019-02-18 11:44:43
    输入标签,然后按Tab键,无需输入尖括号<> . 其他指令也类似,用tab键来启动自动生成代码指令. 示例: 输入div按tab键,自动出现 <div></div> 一、手机端页面适配快捷键 输入: meta:vp 再按tab键就...
    收起

  • webstorm快速创建react模板快捷键

     2019-10-07 00:28:50
    https://blog.csdn.net/weixin_43606158/article/details/90900061 转载于:https://www.cnblogs.com/cazj/p/11287447.html
    收起

  • webstorm 如何自定义代码的补全提示,快捷输入?

     2021-05-21 18:21:53
    非常方便，对于常用的代码进行补齐 操作步骤链接：here
    收起

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,853
精华内容 1,541
热门标签
关键字：

webstorm快捷输入