SASS

Question

में नेस्टेड मिश्रण या फ़ंक्शन कुछ शरीर को पता है कि मैं SASS में नेस्टेड मिश्रित या फ़ंक्शंस का उपयोग कैसे कर सकता हूं? मेरे पास ऐसा कुछ है:

@mixin A(){ 
    do something.... 
} 

@mixin B($argu){ 
    @include A(); 
} 

Answer 1

हाँ आप पहले से ही इसे सही कर रहे हैं। आप पहले मिश्रण में पहले मिश्रण को कॉल कर सकते हैं। इस कलम की जाँच http://codepen.io/crazyrohila/pen/mvqHo

Answer 2

आप बहु घोंसला mixins, आप भी जगह धारकों mixins के अंदर उपयोग कर सकते हैं कर सकते हैं ..

@mixin a { 
    color: red; 
} 
@mixin b { 
    @include a(); 
    padding: white; 
    font-size: 10px; 
} 
@mixin c{ 
    @include b; 
    padding:5; 
} 
div { 
    @include c(); 
} 

जो बाहर सीएसएस

div { 
    color: red; 
    padding: white; 
    font-size: 10px; 
    padding: 5; 
} 

Answer 3

देता है के रूप में अन्य उत्तर में उल्लेख किया है, तो आप अन्य मिश्रणों में mixins शामिल कर सकते हैं। इसके अलावा, आप अपने mixins का दायरा कर सकते हैं।

उदाहरण

.menu { 
    user-select: none; 

    .theme-dark & { 
    color: #fff; 
    background-color: #333; 

    // Scoped mixin 
    // Can only be seen in current block and descendants, 
    // i.e., referencing it from outside current block 
    // will result in an error. 
    @mixin __item() { 
     height: 48px; 
    } 

    &__item { 
     @include __item(); 

     &_type_inverted { 
     @include __item(); 

     color: #333; 
     background-color: #fff; 
     } 
    } 
    } 
} 

विल उत्पादन:

.menu { 
    user-select: none; 
} 

.theme-dark .menu { 
    color: #fff; 
    background-color: #333; 
} 

.theme-dark .menu__item { 
    height: 48px; 
} 

.theme-dark .menu__item_type_inverted { 
    height: 48px; 
    color: #333; 
    background-color: #fff; 
} 

Scoping mixins मतलब है कि आप उत्पन्न झगड़ों के बिना अलग-अलग दायरों में एक ही नाम दिया है कई mixins हो सकता है।