1.＆は親クラスとして使用できます
たとえば、次のコードを見てください。内部にクラス名を書き込むだけです。プロジェクトを自分で書くときは、私と同じではありません。
.ding{
.qi{
width: 100px;
height: 200px;
background-color: #1bc4fb;
}
.sui{
width: 300px;
height: 200px;
color: red;
&.xi{
width: 360px;
height: 360px;
}
}
}
コンパイルされたcssファイル：
.ding .qi {
width: 100px;
height: 200px;
background-color: #1bc4fb;
}
.ding .sui {
width: 300px;
height: 200px;
color: red;
}
.ding .sui.xi {
width: 360px;
height: 360px;
}
あなたは見つけて.sui（その親要素）になります
2.＆はセレクターの順序を変更できます
.ding{
width: 520px;
height: 520px;
content: 'test9988';
color: red;
.qi{
width: 100px;
height: 200px;
background-color: #3a84ff;
}
.sui{
width: 120px;
height: 200px;
color: #7a7a7a;
}
.xi &{
width: 666px;
height: 520px;
content: 'test';
}
}
CSSコード：
.ding {
width: 520px;
height: 520px;
content: 'test9988';
color: red;
}
.ding .qi {
width: 100px;
height: 200px;
background-color: #3a84ff;
}
.ding .sui {
width: 120px;
height: 200px;
color: #7a7a7a;
}
.xi .ding {
width: 666px;
height: 520px;
content: 'test';
}
/*# sourceMappingURL=test1.css.map */
.dingは.xiの後ろまで走った