什么 VSCODE 扩展，将短标签和类句子变成扩展代码（内部示例）

Question

visual studio 代码

中的哪个扩展执行此操作

ul.menu > li.item*3 > a.link#www.code.com > Click Me

它将与

交换

<ul class="menu">
   <li class="item"><a class="link" a="www.code.com">Click Me</a></li>
   <li class="item"><a class="link" a="www.code.com">Click Me</a></li>
   <li class="item"><a class="link" a="www.code.com">Click Me</a></li>
</ul>

Answer 1

你有几个问题。

删除 spaces，emmet 将无法“跨越”spaces。
你有 a="www.code.com" 我假设你的意思是 id="www.code.com"，但这是有问题的，因为 . 将被 emmet 解释为更多类在这个：a.link#www.code.com。这可以通过自定义属性语法 [attributeName="attributeValue"] 来解决。参见 https://docs.emmet.io/abbreviations/syntax/#custom-attributes
您的最终文本也有一个 space，所以将其包装在 {}
中

所以你必须做：

ul.menu>li.item*3>a.link[id="www.code.com"]{Click Me}

扩展为：

<ul class="menu">
  <li class="item"><a href="" class="link" id="www.code.com">Click Me</a></li>
  <li class="item"><a href="" class="link" id="www.code.com">Click Me</a></li>
  <li class="item"><a href="" class="link" id="www.code.com">Click Me</a></li>
</ul>

如果您真的将 a="www.code.com" 作为属性，那么将其设为自定义属性，如 ul.menu>li.item*3>a.link[a="www.code.com"]{Click Me}

最后，emmet 需要一个 href 属性和值，因为它是一个 a 标签。如果您不想要一个，请告诉我们 - 您可以使用自定义 emmet 片段来消除它。

什么 VSCODE 扩展，将短标签和类句子变成扩展代码（内部示例）

What VSCODE Extension that turns short tags and classes sentence into expanded code (example inside)

html

visual-studio-code

code-snippets

什么 VSCODE 扩展，将短标签和 类 句子变成扩展代码（内部示例）

What VSCODE Extension that turns short tags and classes sentence into expanded code (example inside)

html

visual-studio-code

code-snippets

什么 VSCODE 扩展，将短标签和类句子变成扩展代码（内部示例）