قوانین تودرتو Sass(Sass Nested Rules)


Sass به شما امکان می دهد انتخابگرهای CSS را به همان روشی که HTML قرار داده است، قرار دهید.


به نمونه ای از کدهای Sass برای پیمایش یک سایت نگاه کنید:




مثال


SCSS Syntax:



nav {
  ul {
    margin: 0;
   
padding: 0;
    list-style: none;
  }
 
li {
    display: inline-block;
  }
  a {
    display:
block;
    padding: 6px 12px;
   
text-decoration: none;
  }
}


Run مثال »




توجه کنید که در Sass، ul،
انتخابگرهای li و a در داخل nav انتخابگر.



در حالی که در CSS، قوانین یک به یک تعریف می شوند (غیر تودرتو):



CSS Syntax:



nav ul {
  margin: 0;
  padding: 0;
  list-style:
none;
}
nav li {
  display: inline-block;
}
nav a {
 
display: block;
  padding: 6px 12px;
  text-decoration: none;

}




از آنجایی که می‌توانید ویژگی‌ها را در Sass قرار دهید، تمیزتر و خواندن آن آسان‌تر است
از CSS استاندارد.