Sass

Sass هي امتداد للغة CSS تضيف قوةً وأناقةً إلى اللغة الأصلية. إذ تسمح لك باستخدام المتغيرات والقواعد المتشعّبة والمخاليط (mixins) والاستيراد المُدرج (inline imports) وغير ذلك، مع توافقٍ كامل مع صياغة CSS. تساعد Sass على تنظيم ملفات الأنماط الكبيرة تنظيمًا جيدًا، وتجعل ملفات الأنماط الصغيرة جاهزةً للاستعمال في أسرع وقت، لا سيما بمساعدة مكتبة Compass.

الميزات

التوافق التام مع CSS
توسيع للّغة بإضافة أشياء مثل المتغيرات، التشعّب والمخاليط (mixins)
العديد من الدوال المفيدة لمعالجة الألوان وغيرها من القيم
ميزات متقدمة مثل مُوجّهات التحكم (control directives) للمكتبات
منسقة جيدًا، مع إمكانية تخصيص المُخرجات

الصياغة (Syntax)

هناك صياغتان متاحتان لتقنية Sass. أولهما، الصياغة المعروفة باسم SCSS (اختصار Sassy CSS) والتي سنستخدمها في هذا التوثيق، هذه الصياغة هي امتداد للغة CSS. وهذا يعني أنّ كل ملف CSS صالح هو تلقائيًا ملف SCSS صالح دون تغييرٍ في المعنى. وبالإضافة إلى ذلك، SCSS يفهم معظم حيل CSS والصيغ الخاصة بالمتصفحات، مثل الخاصية filter القديمة الخاصة بالمتصفح IE. هذه الصياغة معزَّزة بميزات Sass الموضحة أدناه. امتداد الملفات التي تستخدم هذه الصياغة هو scss..

الصياغة الثانية والقديمة، والمعروفة باسم الصياغة الإزاحية indented syntax (أو فقط "Sass")، تتيح وسيلة أكثر إيجازًا لكتابة CSS. إذ تستخدم الإزاحة بدلًا من الأقواس المعقوفة للإشارة إلى التشعّب والمُحددات (selectors)، والأسطر الجديدة بدلًا من الفاصلة المنقوطة لفصل الخاصيات. يجد بعض الناس أنّ هذا أسهل للقراءة وأسرع في الكتابة من SCSS. الصياغة الإزاحية لديها نفس الميزات، على الرغم من أنّ بعضًا منها تصاغ بطريقة مختلفة قليلًا؛ وهذا مُوضَّح في مرجع الصياغة الإزاحية. امتداد الملفات التي تستخدم هذه الصياغة هو sass..

يمكن لكلا الصياغتين استيراد الملفات المكتوبة بالأخرى. ويمكن تحويل الملفات تلقائيًا من إحدى الصياغتين إلى الأخرى باستخدام أداة سطر الأوامر sass-convert:

# Convert Sass to SCSS
$ sass-convert style.sass style.scss
# Convert SCSS to Sass
$ sass-convert style.scss style.sass

لاحظ أنّ هذا الأمر لا يُنشئ ملفات CSS. استخدم لأجل ذلك الأمر Sass الذي سنوضّحه في موضع آخر.