LESS တွင် selector များကို ချိတ်ဆက်ခြင်း
တစ်ခါတစ်ရံတွင် ကျွန်ုပ်တို့သည် nested တည်ဆောက်ပုံများကို compile လုပ်သည့်အခါ ၎င်းတို့သည် ခြားနားချက်ဖြင့် မဟုတ်ဘဲ တစ်ဆက်တည်း ပေါင်းစပ်ချင်ပါသည်။ ဤအတွက် nested selector ၏ အမည်ရှေ့တွင် ampersand ကို ထားရန်လိုအပ်သည်။
div {
&.block {
width: 300px;
}
}
ရလဒ်အနေဖြင့် compile ပြီးနောက် ကျွန်ုပ်တို့ရရှိမည့် ကုဒ်မှာ အောက်ပါအတိုင်းဖြစ်သည်။
div.block {
width: 300px;
}
အောက်ပါကုဒ်၏ compile ရလဒ်သည် အဘယ်သို့ဖြစ်မည်ကို ရှင်းပြပါ။
#block {
&.xxx {
width: 300px;
}
}
အောက်ပါကုဒ်၏ compile ရလဒ်သည် အဘယ်သို့ဖြစ်မည်ကို ရှင်းပြပါ။
#block {
.xxx {
width: 300px;
}
}
အောက်ပါကုဒ်၏ compile ရလဒ်သည် အဘယ်သို့ဖြစ်မည်ကို ရှင်းပြပါ။
#block {
&.xxx {
&.zzz {
width: 300px;
}
}
}
အောက်ပါကုဒ်၏ compile ရလဒ်သည် အဘယ်သို့ဖြစ်မည်ကို ရှင်းပြပါ။
#block {
&.xxx {
.zzz {
width: 300px;
}
}
}
အောက်ပါကုဒ်၏ compile ရလဒ်သည် အဘယ်သို့ဖြစ်မည်ကို ရှင်းပြပါ။
#block {
.xxx {
&.zzz {
width: 300px;
}
}
}
