使用 emmet 的类名称的子 div 块

Question

我想使用 Emmet 代码嵌套带有类名的 div 块，但我无法弄清楚。

类似这样的：

<div class="map">
    <div class="cardcontainer">
    </div>
</div>

我知道 div>div 会生成一个嵌套的 div 块，我可以执行 .map+.cardcontainer 来生成两个同级 div，但 .map>.cardcontainer 不起作用。

谢谢。

Answer 1

div.map>div.cardcontainer

对我有用。当你打字时，vscode 中的智能感知非常棒。

Answer 2

你可以这样做：

.map>.cardContainer

然后按

tab

。

当您使用

.

时，

emmet

会自动将其转换为

div

元素，因此无需编写

div

。

>

符号（没有

'white space'

）用于嵌套即将到来的

.className

或

HTML

元素。

此外，在声明一个名称超过一个单词的类名时，通常使用：

'camel case'

，如下所示：

class="cardContainer"

。或者只是通过

-

将它们分开，如下所示：

class="card-container"

（通常

'camel case'

更常用于 styling 声明，而不是 function 声明）。

这使得你的代码更容易阅读，特别是当你有很长的类/变量/函数名，并且有很多行代码需要阅读时。

希望有帮助:) 干杯！