LESSda Miksinlar

Ushbu darsda biz miksinlar (aralashmalar) bilan tanishamiz, bu bitta classni boshqasining ichiga kiritish imkonini beradi. Keling, bu nima ekanligi va u bilan qanday ishlashni tushunib olaylik.

Aslida aralashma bu bitta classlarni boshqalarining ichida ishlatish, ya'ni bitta class andozaga aylanishi - kodning ma'lum bir qismi, uni biz ko'p joylarda ishlatishimiz mumkin.

Bu qulay nima? Sof CSSda biz ushbu andoza kodni kerak bo'ladigan hamma joyda yozishimiz kerak bo'lar edi, LESSda esa uni bitta joyda yozish va keyin kerakli kod joylariga ulash mumkin.

Keling, bir misolni ko'rib chiqaylik. Faraz qilaylik, bizda quyidagi class mavjud:

.mix {
	width: 100px;
	height: 100px;
}

Keling, ushbu classni aralashma sifatida ishlataylik:

p {
	.mix;
	color: red;
}

Natijada, kompilyatsiyadan so'ng, abzasga bizning classimizning uslublari qo'shiladi:

p {
	width: 100px;
	height: 100px;
	color: red;
}

Quyidagi kodning kompilyatsiya natijasi qanday bo'lishini ayting:

.mix {
	color: white;
	background: black;
}

p {
	.mix;
	width: 300px;
}