SASS ရှိ mixins များအတွင်း အကြောင်းအရာ ဘလောက်များ

Mixins အတွင်းရှိ စတိုင်ဘလောက်များကို လွှဲပြောင်းရန် @content ညွှန်ကြားချက်ကို အသုံးပြုပါမည်။ ထိုနေရာတွင် ကျွန်ုပ်တို့လိုအပ်သော စတိုင်များ ထည့်သွင်းမည်ဖြစ်သည်။

ဥပမာတစ်ခုကို ကြည့်ရှုကြပါစို့။

@mixin active {
	* div {
		@content;
	}
}

@include active {
	#block {
		color: red;
	}
}

ကမ္ပလိုက်အဖြစ် ပြောင်းလဲပြီးနောက် ရလဒ်။

* div #block {
	color: red; 
}

သိထားရမည့်အချက်မှာ @content ညွှန်ကြားချက်ကို တစ်ကြိမ်ထက်ပို၍ သို့မဟုတ် loop အတွင်းတွင် ဖော်ပြပါက၊ စတိုင်ဘလောက်များကိုလည်း အကြိမ်အရေအတွက်အတိုင်း ခေါ်ယူသွားမည်ဖြစ်သည်။

@mixin active {
	div {
		@content;
	}
navbar {
		@content;
	}
}
@include active {
	#block {
		color: red;
	}
	button {
		color:green;
	}
}

ကမ္ပလိုက်အဖြစ် ပြောင်းလဲပြီးနောက် ကျွန်ုပ်တို့ မြင်ရမည်မှာ။

div #block {
	color: red; 
}
div button {
	color: green; 
}

navbar #block {
	color: red; 
}
navbar button {
	color: green; 
}

အောက်ပါကုဒ်၏ ကမ္ပလိုက်အဖြစ် ပြောင်းလဲပြီးနောက် ရလဒ်က မည်သို့ဖြစ်မည်ကို ရှင်းပြပါ။

@mixin super-link {
	a {
		@content;
	}
}
@include super-link {
	color: blue;
	text-decoration: underline;
}

@mixin super-link {
	a {
		@content;
	}
	a .primary-link{
		@content;
		font-weight: bold;
	}
}
@include super-link {
	color: blue;
	text-decoration: underline;
}

သင့်တွင် အောက်ပါ mixin ရှိသည်ဆိုပါစို့။

@mixin colors {
	...
}

@content ညွှန်ကြားချက်ကို အသုံးပြု၍ #primary နှင့် သက်ဆိုင်သော လင့်ခ်အားလုံးအတွက် ဖောင့်အရောင် အနီရောင်နှင့် လှိုင်းတွန့်အောက်မျဉ်းသားခြင်းကို သတ်မှတ်ပါ။