LESS-теги миксиндер

Бул сабакта биз миксиндер (примешивание) менен таанышабыз, бул бир классты экинчи класстын ичине киргизүүгө мүмкүндүк берет. Келгиле, бул эмне жана аны менен кантип иштөө керек экендигин түшүнөлү.

Негизи, миксиндер - бул бир класстарды башка класстардын ичинде колдонуу, бир класс заготовка болуп саналат - аны биз көптөгөн жерлерде колдоно ала турган коддун белгилүү бир бөлүгү.

Бул эмне үчүн ыңгайлуу? Таза CSS-те бизге заготовка кодду аны керек болгон бардык жерлерде жазып чыгуу керек болот, ал эми LESS-те аны бир жерде гана жазып, андан кийин аны коддун керек болгон жерлерине туташтырса болот.

Келгиле, мисалда карап көрөлү. Бизде төмөнкү классты бар деп коёлу:

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

Келгиле, бул классты миксин катары колдонолу:

p {
	.mix;
	color: red;
}

Натыйжада, компиляциядан кийин абзацка биздин класстын стилдери коюлат:

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

Төмөнкү коддун компиляциядан кийинки натыйжасы кандай болорун айтыңыз:

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

p {
	.mix;
	width: 300px;
}