SASS හි මික්සින් පරාමිතීන්
SASS හි මික්සින්වල වැදගත් ලක්ෂණයක් වන්නේ ඒවා පරාමිතීන් ලෙස විචල්ය පිළිගැනීමයි, ඒවා වරහන් තුළ ලියනු ලැබෙන අතර, විචල්ය කිහිපයක් තිබේ නම්, ඒවා කොමාවෙන් වෙන් කරනු ලැබේ.
පහත උදාහරණය සලකා බලමු:
@mixin active($color, $width) {
border: {
color: $color;
width: $width;
style: dotted;
}
}
p {
@include active(yellow, 2px);
}
සම්පාදනයේ ප්රතිඵලය:
p {
border-color: yellow;
border-width: 2px;
border-style: dashed;
}
ඊට අමතරව, මික්සින් වලට පෙරනිමි අගයන් පරාමිතීන් ලෙස ලබා දිය හැක:
@mixin active($color, $width: 2px) {
border: {
color: $color;
width: $width;
style: dotted;
}
}
p {
@include active(yellow);
}
div {
@include active(yellow, 4px);
}
සම්පාදනයෙන් පසු අපට පෙනෙන්නේ:
p {
border-color: yellow;
border-width: 2px;
border-style: dotted;
}
div {
border-color: yellow;
border-width: 4px;
border-style: dotted;
}
පහත කේතයේ සම්පාදන ප්රතිඵලය කුමක්දැයි පවසන්න:
@mixin simple-border($padding-top, $padding-bottom) {
border: {
padding-top: $padding-top;
padding-bottom: $padding-bottom;
color: green;
}
}
p {
@include simple-border(10px, 30px );
}
පහත කේතයේ සම්පාදන ප්රතිඵලය කුමක්දැයි පවසන්න:
@mixin simple-border($padding-top, $padding-bottom: 20px) {
border: {
padding-top: $padding-top;
padding-bottom: $padding-bottom;
color: green;
}
}
p {
@include simple-border(10px);
}