What are nested rules in SASS?

Santhosh Kumar
Santhosh Kumar

Posted On: Feb 22, 2018

 

  • The SASS created a nested style to overcome the repetitive code.
  • The one style tag can include other style tags. The sass combines outer and inner style tags.
  • You can see the detail below.

my style.scss

v{
              form{
                   color:green;
                   }
             ul{
                  border:black;
                 }

myStyle.css

  nav form{
                   color:green;
                   }
            nav ul{
                  border:black;
                 }
  • The sass selector separates using comma (,) and combines the multiple outer and inner selector automatically.

myStyle1.scss

av , .pack{
           form, ul {
                   color:green;
                  border:black;
                 }

myStyle1.css

.nav form, .nav ul, .pack form, .pack ul {
                   color: green; 
                   border:black;
                 }
  • The sass combinator is used when two selectors want to combine for style.

myStyle2.scss

av > {
      form{
           color:green;
          }
     }

myStyle2.css

nav >form{
           color:green;
         }

    Related Questions

    Please Login or Register to leave a response.

    Related Questions

    SASS Interview Questions

    What is SASS?

    The sass is the acronym of synthetically Awesome Style Sheet. This is a CSS pre-processor. The sass used to minimize the repetition of CSS style tags and save time. This is a more stable extension ...

    SASS Interview Questions

    Who is the father of SASS?

    The SASS language primarily designed by Hampton Catlin and developed by Natalie Weizenbaum. After the primary version, Natalie Weizenbaum and Chris Eppstein are continuing for SASS with a scripting...

    SASS Interview Questions

    Enlist few features of SASS?

    The Sass is time-saving and minimizes the coding language. Some basic features of SASS which come daily basis is below. List and @each directive together. The list is an initial feature of sass but...