მიქსინები 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;
}