Question

我开始将Visual Studio Code用于我的Web项目，没有Emmet我将无法生存，但是当我尝试使用属性扩展HTML标记中的缩写时，我遇到了一个问题。只是一个例子。如果我写html:5并按TAB键，它将展开所有HTML5模板

<!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>

并用id和class编写标记，例如p#id.class，它将正确生成下一段代码

<p id="id" class="class"></p>

但是当我想用方括号内的其他属性扩展相同的标签时，它不起作用。只需在代码中添加一个制表符空间即可。

p[align="center"]

同样的事情，如果我尝试使用大括号在标签中添加文本

p{Test}

您能帮我知道如何配置它，还是我的软件/扩展程序有问题？

此致

Answer 1

在Visual Studio代码中：文件>首选项>设置>扩展名> Emmet>在settings.json文件中编辑

添加以下对我有用的代码。

"emmet.triggerExpansionOnTab": true,
"files.associations": {"*html":"html"},

我希望它能对某人有所帮助。

Answer 2

几天后，我对Emmet in Visual Studio Code webpage进行了调查，找到了解决方案。

您需要在用户设置文件中添加下一行，以使用Tab键扩展Emmet的缩写：

"emmet.triggerExpansionOnTab": true

这是因为默认情况下在Visual Studio Code上是禁用的。

Answer 3

我认为方括号不再适用于emmet ... 但是，对于大括号，应使用p> {text}。据我了解，它用于在元素内添加文本。

所以p> {text here}将产生<p>text here</p>

如果您仍然需要更多帮助，请查看emmet的缩写语法文档：The Emmet Docs - Abbreviations Syntax

Answer 4

在Visual Studio Code中编辑文件settings.json的路径文件>首选项>设置>扩展名> Emmet>在settings.json中编辑

find file settings.json Edit file settings.json

具有属性的Emmet扩展缩写在Visual Studio Code中不起作用

4 个答案: