Vigezo vya Mixins katika SASS

Kipengele muhimu cha mixins katika SASS ni kwamba zinaweza kukubali vigezo kama parameta, ambayo huandikwa ndani ya mabano ya duara na, ikiwa kuna vigezo vingi, baso hutenganishwa kwa vitone.

Tuchunguze mfano ufuatao:

@mixin active($color, $width) {
	border: {
		color: $color;
		width: $width;
		style: dotted;
	}
}
p {
	@include active(yellow, 2px);
}

Matokeo ya ukusanyaji:

p {
	border-color: yellow;
	border-width: 2px;
	border-style: dashed; 
}

Zaidi ya hayo, inawezekana kupitisha thamani za chaguo-msingi kwenye mixins:

@mixin active($color,  $width: 2px) {
	border: {
		color: $color;
		width: $width;
		style: dotted;
	}
}
p {
	@include active(yellow);
}
div {
	@include active(yellow, 4px);
}

Baada ya ukusanyaji tutaona:

p {
	border-color: yellow;
	border-width: 2px;
	border-style: dotted;
}
div {
	border-color: yellow;
	border-width: 4px;
	border-style: dotted;
}

Eleza, matokeo ya ukusanyaji ya mpango ufuatao yatakuwa nini:

@mixin simple-border($padding-top, $padding-bottom) {
	border: {
		padding-top: $padding-top;
		padding-bottom: $padding-bottom;
		color: green;
	}
}
p {
	@include simple-border(10px, 30px );
}

Eleza, matokeo ya ukusanyaji ya mpango ufuatao yatakuwa nini:

@mixin simple-border($padding-top, $padding-bottom: 20px) {
	border: {
	padding-top: $padding-top;
	padding-bottom: $padding-bottom;
	color: green;
	}
}
p {
	@include simple-border(10px);
}