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 الذي سنوضّحه في موضع آخر.
تثبيت وضبط واستخدام Sass
شرح طريقة تثبيت Sass، وخيارات الضبط المتاحة فيها، واختيار الصياغة المناسبة، والترميز الملائم.
ملحقات CSS في Sass
شرح القواعد والخصائص التشعبية، وطريقة استعمال المُحدِّد النائب، والإشارة إلى المُحدِّد الأب.
التعليقات
تبيان نوعي التعليقات المتاحين في Sass.
صياغة SassScript
تسمح صياغة SassScript باستخدام المتغيرات، ومختلف أنواع البيانات مع إجراء عمليات عليها، ويمكن عبرها استدعاء المخاليط (mixins) والدوال.
قواعد @-Rules
تسمح هذه القواعد باستيراد (@import) ملفات Sass الأخرى، وتوسعة (@extend) المُحدِّدات، وتوفير ميزات أكثر لاستعلامات الوسائط (@media)، وتوفير طرائق لإخراج رسائل التنقيح (@debug) والتحذيرات (@warn) والأخطاء (@error).
موجهات التحكم
يمكن أن تستعمل موجهات وتعابير التحكم لتطبيق شرط معيّن (@if) أو تكرار تعبير برمجي مُحدَّد (الحلقات @for و @each و @while).
المخاليط (Mixins)
تتيحُ المخاليط تعريف الأنماط التي يُمكن إعادة استخدامها في ملف الأنماط دون الحاجة إلى اللجوء إلى الأصناف التي لا يدل اسمها على محتواها.
موجهات الدوال في Sass
تسمح موجهان الدوال بتعريف دوال خاصة بالمستخدم واستخدامها في أيِّ سياق أو على أيّ قيمة داخل الملف البرمجي.
أنماط المخرجات
يمكن تخصيص بنية مستندات CSS الناتجة، وتتيح Sass أربعة أنماط لتنسيق المخرجات.
توسعة Sass
توفر Sass عددًا من التّخصيصات المتقدمة لأجل المستخدمين ذوي المتطلبات الفريدة، مثل تخصيص التخزين المؤقت، والمستوردات المخصصة.