下图中的结构，偷懒的都会直接一个！=> Tab 解决，这样可以快速生成基础的结构，同时防止手写时忘记某个代码块，输入错误的代码。
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body></body></html>
快捷方式：! + tal键
id指令:**#** ; class指令: **.**
收藏
<div id="test"></div><div class="test"></div>子节点指令:> ; 兄弟节点指令:+ ; 上级节点:^
<div><ul><li><p></p></li></ul></div>
<div></div><ul></ul><p></p>
<div><ul><li></li></ul><div></div></div>
(这里的^是接在li后面所在li的上一级，与ul成了兄弟关系,当然两个^^就是上上级）
<div></div><div></div><div></div><div></div><div></div>
（ * 号后面添加数字表示重复的元素个数）
分组指令：()
<div><ul><li><a href=""></a></li></ul><div><p></p></div></div>
（括号里面的内容为一个代码块，表示与括号内部嵌套和外面的的层级无关）
解释：
这里如果不加括号的话，猜想下，div>ul>li>a+div>p这样div就是和a是兄弟关系了，会包含在li里面。懂了吧哈哈
<div><ul><li><a href=""></a><div><p></p></div></li></ul></div>
属性指令：[]
（中括号内填写属性键值对的形式，并且空格隔开）
<a href="###" name="xiaoA"></a>
编号指令：$
（$代表一位数，后面跟上*数字就代表从1递增到填写的数字）
<ul><li class="test1"></li><li class="test2"></li><li class="test3"></li></ul>
注意： 一个$ 代表一位数,$$$(001)
如果想自定义从几开始递增的话就利用：$@+数字*数字
例如： ul>li3.test$@3
<ul><li class="test3"></li><li class="test4"></li><li class="test5"></li></ul>
文本指令：{}
ul>li.test$*3{测试$}
<ul><li class="test1">测试1</li><li class="test2">测试2</li><li class="test3">测试3</li></ul>
（{里面填写内容，可以和$一起组合使用哦}）
这个标签没有指令，而是部分标签可以不使用输入标签，直接输入指令，即可识别父类标签。
例如：.test
<div class="test"></div>
例如：ul>.test$*3
<ul><li class="test1"></li><li class="test2"></li><li class="test3"></li></ul>
例如：select>.test$*5
<select name="" id=""><option class="test1"></option><option class="test2"></option><option class="test3"></option><option class="test4"></option><option class="test5"></option></select>
等等…
隐私标签有如下几个：
li：用于 ul 和 ol 中
tr：用于 table、tbody、thead 和 tfoot 中
td：用于 tr 中
option：用于 select 和 optgroup 中
最后就是：看没用，操作几遍，几分钟你就能掌握这些指令，然后飞快的撸码
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
