<!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>
