ساس (زبان سبک نویسی)

**ساس** مخفف واژه (***S'''yntactically '''A'''wesome '''S'''tyle'''s'''heets'') یک زبان [[پیش‌پردازنده|پیش‌پردازه‌نویسی]] است که در نهایت به زبان [[سی‌اس‌اس|css]]‌ تفسیر یا کامپایل می‌شود. این زبان، خود یک زبان اسکریپت‌نویسی محسوب می‌شود.

این زبان در ابتدا تحت تأثیر [[زبان نشانه‌گذاری|زبان نشانه گذاری]] [[YAML]] بود که توسط همپتون کاتلین و ناتالی ویزنباوم طراحی و ساخته شد.

پس از اتمام نسخهٔ اولیه، ویزنباوم و کریس اپپشتین به کار خود روی Sass ادامه دادند و با استفاده از SassScript، یک زبان ساده نویسی را برای استفاده در پرونده‌های Sass اجرا کردند. علاوه بر نرم‌افزار [[کامپایلر]] مبتنی بر خط فرمان که تحت [[پروانه ام‌آی‌تی|مجوز MIT]] برای بسیاری از سیستم‌عامل‌ها وجود دارد، برنامه‌های پردازش دیگری نیز برای این زبان ایجاد شده‌اند.

علاوه بر اصطلاح اصلی SASS مشابه YAML , Sass هم از ساختار نوشتاری جدیدتر و در حال حاضر گسترده‌تر نسبت به SCSS نیز پشتیبانی می‌کند، که مبتنی بر نشانه گذاری‌های کلاسیک CSS است.

== مکان نماها ==
=== سازوکارهای درونی ===
یکی از ویژگی‌های کلیدی سازوکارهای درونی''(قوانین تو در تو)'' می ''باشد.'' این کار [[سواد|خواندن و نوشتن]] انتخابگرهای پیچیده تو در تو را آسان می‌کند. <syntaxhighlight lang="sass">
#header
  background: #FFFFFF
  /* -or-  :background #FFFFFF */

  .error
    color: #FF0000

  a
    text-decoration: none
    &:hover
      text-decoration: underline

</syntaxhighlight> نوشتار بالا در [[CSS]] به صورت زیر است: <syntaxhighlight lang="css">
#header {
  background: #FFFFFF;
}
#header .error {
  color: #FF0000;
}
#header a {
  text-decoration: none
}
#header a:hover {
  text-decoration: underline
}
</syntaxhighlight>

==== عنوان‌های نمایش داده شده ====
یک ویژگی خاص ساس لانه سازی سؤالات رسانه در انتخابگرها است. امکان نامبرده این اجازه می‌دهد تا خطوط سبک در [[کد منبع]] برای همان عنصر در همان مکان حفظ شود. <syntaxhighlight lang="sass">
#header{
  color: red
  @media (min-width: 400px){
    color: blue;
  }
}
</syntaxhighlight> که در [[CSS]] به شرح زیر است: <syntaxhighlight lang="css">
#header {
  color: red;
}
@media (min-width: 400px){
  #header {
    color: blue;
  }
}

</syntaxhighlight>

=== متغیرها (جایگذارها) ===
'''ساس''' اجازه استفاده از متغیرها ''(بپارسی: جاگذار)'' را می‌دهد. این باعث می‌شود که مقادیر خاصی را در شیوه نامه‌های بزرگ ثابت نگه داشته شود. وظایف نگهداری با تعیین متغیرها به صورت مرکزی ساده‌تر می‌شوند. <syntaxhighlight lang="sass">
$link_color: #00F

a
  color: $link_color
</syntaxhighlight> که در [[CSS]] به شرح زیر است: <syntaxhighlight lang="css">
a {
  color: #00F
}
</syntaxhighlight>

=== میکسین ها (دربرنامه نویسی شیء گرا) ===
میکسین‌ها اجازه ارجاع چندباره در همه بخش‌ها را می‌دهد. براساس توابع موجود در زبانهای برنامه‌نویسی کلاسیک، میکسین همچنین می‌تواند آرگومان‌ها را منتقل کند. مانند جملات عادی، میکسین‌ها می‌توانند حاوی انتخاب کننده‌های تو در تو باشند. مثال زیر متغیر <code>$farbe</code> در میکسین را به عنوان رنگ پس زمینه اختصاص می‌دهد. <syntaxhighlight lang="sass">
@mixin box($farbe){
  padding: 1rem;
  border: 2px solid gray;
  background: $farbe;
}

a
  @include box(red);

</syntaxhighlight> که در [[CSS]] به شرح زیر است: <syntaxhighlight lang="css">
a {
  padding: 1rem;
  border: 2px solid gray;
  background: red;
}
</syntaxhighlight>

== ساختار ویرایش SCSS ==
علاوه بر ساختار نوشتن Sass که در بالا توضیح داده شد، Sass ساختار نوشتاری جدیدتر و کاربردی تری بنام SCSS دارد. در اینجا، لانه سازی انتخاب کننده‌ها با تورفتگی متن منبع مشخص نمی‌شود، بلکه توسط براکت‌ها و مانند نماد کلاسیک CSS تعیین می‌شود. همچنین، در پایان قوانین نشان [[نقطه ویرگول]] لازم است.

=== مقایسه کدنویسی ===
==== ساس ====
<syntaxhighlight lang="sass">
$meineFarbe: #3BBFCE

.navigation
  border-color: $meineFarbe
  color: darken($meineFarbe, 9%)
</syntaxhighlight>

==== SCSS ====
<syntaxhighlight lang="scss">
$meineFarbe: #3BBFCE;

.navigation {
  border-color: $meineFarbe;
}
</syntaxhighlight> CSS کامپایل شده در هر دو مورد یکسان است. تبدیل خودکار بین دو گونه ساختار بدون هیچ ایرادی امکان‌پذیر است.

== ساس اسکریپت ==
***ساس اسکریپت (**بانگلیسی: **SassScript)**' یک زبان برنامه‌نویسی است که در Sass استفاده می‌شود. ساس اسکریپت را با ویژگی‌هایی مانند حساب اصلی، روش‌هایی برای دستکاری مقادیر رنگ، سازه‌های حلقه ساده می‌شناسند.

## ایراد
استفاده از زبان انگلیسی برای CSS نیاز به ترجمه به کد CSS از طریق یک پردازنده پردازنده و بنابراین یک مرحله دیگر در فرایند توسعه دارد. ایراد وارده در واقع به اشکال زدایی دشوار همراه و همچنین گسترش منابع احتمالی خطا وارد شده‌است. همچنین ویژگی CSS بعنوان ساختار مادر که با اختصاص کلاس‌ها ارائه می‌شود، در ساس از بین می‌رود.

## جستارهای وابسته
* لس (زبان سبک نویسی)
* استیلوس (زبان سبک نویسی)

## پیوند به بیرون
* وب سایت رسمی
* مخزن کد منبع Sass (Git)
* Haml / Sass Google Group (انگلیسی)
* ترجمه آلمانی راهنمای SASS (آلمانی)

## منابع

رده:ابزارهای برنامه‌نویسی کامپیوتر آزاد
رده:برگه‌های سبک آبشاری
رده:روبی (زبان برنامه‌نویسی)
رده:زبان‌های برنامه‌نویسی ساخته‌شده در ۲۰۰۶ (میلادی)
رده:صفحات با ترجمه بازبینی‌نشده
رده:کتابخانه‌های رایانه‌ای آزاد
رده:موتور الگوی وب
رده:نرم‌افزارهای دارای اجازه‌نامه ام‌آی‌تی