ul>li*5只生成一个空li的常见原因是文件语言模式非HTML或光标位置错误；正确需设为HTML模式、光标在合法位置并按Tab展开。
ul>li*5 生成基础列表时为什么只出一个空
常见错误是输入 ul>li*5 后按 Tab 没反应，或只生成单个 <li>。根本原因通常是：当前文件语言模式不是 html（比如误设为 plaintext 或 javascript），或光标不在标签可展开位置（如写在 JS 字符串里、注释中）。VSCode 默认只在 html、vue、jsx 等支持 Emmet 的语言模式下生效。
实操建议：
- 按
Ctrl+Shift+P（macOS 是Cmd+Shift+P）调出命令面板，输入 “Change Language Mode”，确认当前是HTML - 确保光标在空白行或标签外（不要在引号内、
{}中、//后） - 输入后必须按
Tab或Enter，不能只靠回车或空格
如何给每个 li 添加 class 和自增序号？
手动写 class="item1"、class="item2" 很低效，$ 占位符才是关键。它不是变量，而是 Emmet 内置的编号指令，配合 * 才能触发递增。
正确写法示例：
-
li.item$*3→ 生成三个<li class="item1">到<li class="item3"> -
li.item$$$*4→ 三位补零：item001~item004 -
li.item$@10*2→ 从 10 开始：item10、item11 - 错误写法：
li.item1*3（不会递增）、li.$item*3（$位置错，不生效）
带文本内容和属性的列表怎么一次写完？
用 {} 插入内容、[] 加属性，但顺序和嵌套层级直接影响输出结构。重点在于：内容和属性必须紧贴在标签缩写右侧，不能有空格隔开。
典型场景与写法：
- 普通带文字列表：
ul>li{Item $}*3→<li>Item 1</li>×3 - 带 href 和 class 的导航项：
nav>ul>li*3>a[href="#"]{Link $} - 含 data 属性的菜单项：
li[data-id=$]{Menu $}*5 - 错误示范：
li {text} *3（空格导致解析失败）、li*3{Text}（{}位置错，会被忽略）
复杂嵌套列表（如二级菜单）怎么避免手抖写漏？
多层 > 容易数错括号或漏掉符号，尤其当要混合 +（兄弟）和 ^（上移）时。最稳妥的方式是分段验证：先写最内层，再逐步外扩。
例如生成「主菜单 + 下拉子菜单」结构：
- 先试
li>a{Home}+ul>li*2>a{Sub $}→ 验证子菜单是否生成正确 - 再包一层：
nav>ul>li>a{Home}+ul>li*2>a{Sub $}+li>a{About} - 注意
^的作用：如果想让ul和a平级（即子菜单不嵌在链接里），得写成li>a{Home}^ul>li*2 - VSCode 中可随时按
Ctrl+E（macOSCmd+E）手动触发展开，避免依赖 Tab 键位置判断失误
真正容易被忽略的是：Emmet 不校验语义合法性，ul>div 这种 HTML5 不合法结构它也会照生成——你得自己知道什么该嵌、什么不该嵌。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
