前端開發(fā)的快速編碼插件,只需要敲一行代碼然后按下 “Tab鍵” 就能生成你想要的完整HTML結(jié)構(gòu)。
推薦博客https://www.cnblogs.com/summit7ca/p/6944215.html?tdsourcetag=s_pctim_aiomsg
1.生成html初始結(jié)構(gòu)
輸入!+tab鍵生成
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
</html>
2.帶有id的標簽
div#header
<div id="header"></div>
3.帶有class的標簽
div.header
<div class="header"></div>
4.子節(jié)點
div>ul>li>p
<div>
<ul>
<li>
<p></p>
</li>
</ul>
</div>
5.兄弟節(jié)點
div+ul+p
<div></div>
<ul></ul>
<p></p>
6.上級節(jié)點
div>ul>li^div (這里的^是接在li后面所以在li的上一級,與ul成了兄弟關(guān)系,當然兩個^^就是上上級)
<div>
<ul>
<li></li>
</ul>
<div></div>
</div>
7.重復
div*5
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
8.分組()(括號里面的內(nèi)容為一個代碼塊,表示與括號內(nèi)部嵌套和外面的的層級無關(guān))
div>(ul>li>a)+div>p
<div>
<ul>
<li><a href=""></a></li>
</ul>
<div>
<p></p>
</div>
</div>
9.屬性[]括號內(nèi)填寫屬性鍵值對的形式,并且空格隔開
a[href='www.google.com' name='a']
<a href="www.google.com" name="a"></a>
10.編號
ul>li.test$*3 $代表一位數(shù),后面更上*數(shù)字就代表從1遞增到填寫的數(shù)字
<ul>
<li class="test1"></li>
<li class="test2"></li>
<li class="test3"></li>
</ul>
11.文本 {}
ol>li{hello wold}
<ol>
<li>hello wold</li>
</ol>
12.隱式標簽(默認可以生成的標簽)
.test
<div class="test"></div>