文章目录 sublime / vscode 快捷生成HTML代码的实现1、*基本html结构*操作： ==输入 !+Enter键==实现效果： 2、*生成div加类名的快捷键*操作： ==输入 div.list>div.item_$*6==实现效果： 3、*带类名的div*操作： ==输入 div.wrapper==实现效果： 4、*带id的div*操作： ==div#wrapper==实现效果： 5、*属性 []*操作： ==span[title=“test”]==实现效果： 6、*后代 >*操作： ==输入div>span>a==实现效果： 7、*兄弟 +*操作： ==div+p+span==实现效果： 8、*上级 ^*操作： ==div>span^i==实现效果： 9、乘法 *操作： ==ul>li*2==实现效果： 10、*文本 {}*操作： ==div>span{这是文本}==实现效果：
提示：以下是本篇文章正文内容，下面案例可供参考
1、基本html结构 操作： 输入 !+Enter键注意：这里输入“！”+回车键前，需要清空原来生成的基本结构
实现效果： <!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、生成div加类名的快捷键 操作： 输入 div.list>div.item_$*6 实现效果： <div class="list"> <div class="item_1"></div> <div class="item_2"></div> <div class="item_3"></div> <div class="item_4"></div> <div class="item_5"></div> <div class="item_6"></div></div> 3、带类名的div 操作： 输入 div.wrapper 实现效果： <div class="wrapper"></div> 4、带id的div 操作： div#wrapper 实现效果： <div id="wrapper"></div> 5、属性 [] 操作： span[title=“test”] 实现效果： <span title="test"></span> 6、后代 > 操作： 输入div>span>a 实现效果： <span title="test"></span> 7、兄弟 + 操作： div+p+span 实现效果： <div></div><p></p><span></span> 8、上级 ^ 操作： div>span^i 实现效果： <div><span></span></div><i></i> 9、乘法 * 操作： ul>li*2 实现效果： <ul> <li></li> <li></li></ul> 10、文本 {} 操作： div>span{这是文本} 实现效果： <div><span>这是文本</span></div>