SASS में मिक्सिन पैरामीटर्स

SASS में मिक्सिन की एक महत्वपूर्ण विशेषता यह है कि वे पैरामीटर्स में वेरिएबल्स लेते हैं, जो गोल कोष्ठकों के अंदर लिखे जाते हैं और, यदि कई वेरिएबल्स हैं, तो उन्हें अल्पविरामों से अलग किया जाता है।

निम्नलिखित उदाहरण पर विचार करें:

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

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

styles.cssp {
  border-color: yellow;
  border-width: 2px;
  border-style: dashed; 
}

इसके अलावा, मिक्सिन में डिफ़ॉल्ट मान पैरामीटर्स में पास किए जा सकते हैं:

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

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

styles.cssp {
  border-color: yellow;
  border-width: 2px;
  border-style: dotted;
}
div {
  border-color: yellow;
  border-width: 4px;
  border-style: dotted;
}

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

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