एसएएसएस में पैरामीटर में वेरिएबल्स

ऐसी स्थितियाँ होती हैं जब एक मिक्सिन या फ़ंक्शन को अज्ञात संख्या में पैरामीटर स्वीकार करने होते हैं। इसके लिए एसएएसएस भाषा में "वेरिएबल पैरामीटर्स" या पैरामीटर्स पास करने की सुविधा है, जो फ़ंक्शन या मिक्सिन में अंतिम में निर्दिष्ट होते हैं और पारित किए गए अन्य सभी पैरामीटर्स को एक सूची में पैक कर देते हैं।

ऐसे पैरामीटर्स के बाद एक एलिप्सिस (...) लगाना होता है। आइए निम्नलिखित उदाहरण देखें:

@mixin box-content-padding($padding...) {
	-moz-box-content-padding: $padding;
	-webkit-box-content-padding: $padding;
}
div {
	@include box-content-padding(0px 4px 5px 2px);
}

कंपाइलेशन का परिणाम:

div {
	-moz-box-content-padding: 0px 4px 5px 2px;
	-webkit-box-content-padding: 0px 4px 5px 2px;
}

वेरिएबल फ़ंक्शन या मिक्सिन में नामित पैरामीटर्स भी पास किए जा सकते हैं। उन्हें एक्सेस करने के लिए, फ़ंक्शन keywords($args) का उपयोग किया जाता है, जो उन्हें नामों ($ चिह्न के बिना) और मानों का एक मैप के रूप में लौटाता है।

@mixin common-colors($text-color, $background, $shadow) {
	color: $text-color;
	background-color: $background;
	box-shadow: $shadow;
}

$values: white, green, grey;

.primary {
	@include common-colors($values...);
}

$value-map: (text-color: black, background: grey, shadow: green);

.secondary {
	@include common-colors($value-map...);
}

कंपाइलेशन के बाद हम देखेंगे:

.primary {
	color: white;
	background-color: green;
	box-shadow: grey;
}

.secondary {
	color: black;
	background-color: grey;
	box-shadow: green;
}