SASS एक सीएसएस प्री-प्रोसेसर है यह सीएसएस का एक विस्तार है जिसका प्रयोग मूल भाषा मे Power और Elegance को जोड़ने के लिए किया जाता है. यह आपको Variables, Nested Rules, Mixins, Inline Imports, Inheritance और अधिक जोड़ने के लिए सुविधा प्रदान करता है और यह सभी पूरी तरह से CSS-compatible Syntax के साथ होते है.
SASS अधिक स्थिर और शक्तिशाली सीएसएस एक्सटेंशन भाषा है जो दस्तावेज़ की शैली को स्पष्ट रूप से और संरचनात्मक रूप से वर्णित करता है. यह बड़े स्टाइल शीट को अच्छी तरह व्यवस्थित रखने और जल्दी से छोटी स्टाइल शीट चलाने के द्वारा बहुत उपयोगी होता है.
SASS को शुरुआत मे Hampton Catlin द्वारा डिजाइन किया गया था और 2006 मे नेटली वेज़ेनबाम द्वारा विकसित किया गया था. प्रारंभिक विकास के बाद Natalie Weizenbaum और Chris Eppstein अपने शुरुआती संस्करण के साथ जारी रहे और SASS फाइलों में इस्तेमाल की जाने वाली एक साधारण पटकथा भाषा SassScript के साथ SASS का विस्तार किया था.
SASS पूरी तरह से एक CSS-compatible है.
SASS सीएसएस की तुलना में अधिक स्थिर शक्तिशाली और Elegant है.
SASS जावास्क्रिप्ट पर आधारित है और सीएसएस का सुपरसेट है.
SASS अपने Syntax और पठनीय सीएसएस मे Compiles होता है.
SASS एक Open-source Pre Processor है जिसे सीएसएस मे Interpreted किया जाता है.
SASS Variables Extensions, Nesting और Mixins जैसे भाषा Extensions का समर्थन करता है.
SASS Colors और अन्य Values में हेरफेर करने के लिए कई उपयोगी कार्य प्रदान करता है.
SASS अच्छी तरह से Well-formatted, Customizable Output प्रदान करता है.
SASS आपको प्रोग्रामिंग निर्माण मे Clean, Easy और कम सीएसएस लिखने की सुविधा प्रदान करता है.
SASS मे कम कोड होता है ताकि आप सीएसएस को तेज लिख सके.
SASS एक अधिक स्थिर शक्तिशाली और सुरुचिपूर्ण है क्योंकि यह सीएसएस का विस्तार है.
SASS डिजाइनरों और डेवलपर्स के लिए अधिक कुशलतापूर्वक और जल्दी काम करने को आसान बनता है.
SASS सीएसएस के सभी संस्करणों के साथ Compatible है होता. आप इससे किसी भी उपलब्ध CSS Libraries का उपयोग कर सकते है.
Developer के पास इसका उपयोग करने से पहले इस Preprocessor मे मौजूद नई सुविधाओं को सीखने के लिए पर्याप्त समय होना चाहिए.
SASS का उपयोग ब्राउज़र के Built-in Element Inspector के लाभ खोने का कारण हो सकता है.
SASS एक अन्य प्रीप्रोसेसर से लिया गया है जिसे Haml के नाम से जाना जाता है. यह Ruby Developers द्वारा डिज़ाइन और लिखित किया गया था इसलिए Sass Stylesheets Use Ruby को बिना Braces, no semi-colons और Strict Indentation के Syntax की तरह उपयोग करते है. SASS मे परिवर्तनीय संकेत है $ के बजाय और Assignment Sign = इसके Instead है.
SCSS Sass और CSS के बीच के अंतर को बंद करने के लिए CSS Friendly Syntax को प्रदान करता है SCSS को Sassy CSS भी कहा जाता है.
Sass variables का उपयोग उस जानकारी को Store करने के लिए किया जाता है जिसे आपको आवश्यकता होने पर स्टाइलशीट में पुन उपयोग किया जा सकता है. आप आपने Future Reusability के अनुसार Colors, Font Stacks या किसी भी CSS Value जैसी चीज़ों को Store कर सकते है. आप कुछ प्रतीक बनाने के लिए $ प्रतीक का उपयोग किया जाता है.
SCSS Syntax
$font-stack: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font-stack;
color: $primary-color;
}
Sass आपको स्टाइल शीट मे Basic Mathematical Operations करने की सुविधा प्रदान करता है क्योंकि Appropriate Arithmetic Symbol को लागू करना बहुत आसान होता है. Sass कुछ Standard Mathematical Operators अर्थात +, -, *, /, और % प्रदान करता है.
Sass निम्नलिखित प्रकार के Operators प्रदान करता है. Assignment Operator, Arithmetic Operators, Equality Operator, Comparison Operator, Logical Operators.
Sass Output Style का उपयोग Document की संरचना के लिए CSS Style को Specify करने के लिए किया जाता है. Sass File को Automatically रूप से एक डिफ़ॉल्ट CSS Style को बनाता है जो document की संरचना को दर्शाती है. डिफ़ॉल्ट सीएसएस स्टाइल सभी परिस्थितियों के लिए बिल्कुल सही नही होता है.
Sass कई प्रकार के Output Style का समर्थन करता है जैसे की Nested Output Style, Expanded Output Style, Compact Output Style, Compressed Output Style.
SASS Control Directives और Expressions आपको कुछ स्थितियों के आधार पर स्टाइल का उपयोग करने मे सुविधा प्रदान करता है. यह आपको Variations के साथ कई बार एक ही शैली को लागू करने में सक्षम बनाता है यह SassScript द्वारा समर्थित होता है. Control Directives Compass Libraries का हिस्सा होता है ये मुख्य रूप से मिश्रण में उपयोग किए जाते हैं और काफी Flexibility की आवश्यकता होती है. SASS में उपयोग किए गए Control Directives और Expressions की एक सूची होती है.
CSS एक सरल स्टाइलशीट को संभालने के लिए पर्याप्त होता है लेकिन यदि स्टाइलशीट बड़े और अधिक जटिल हो तो उन्हें बनाए रखना कठिन होता है. Preprocessor इस मामले मे मदद कर सकता है कि सास कुछ विस्तारित विशेषताएं प्रदान करता है जो सीएसएस मे Variables, Nesting, Mixins, Inheritance और अन्य Nifty Goodies में उपलब्ध नही है जो सभी प्रकार की स्टाइलशीट को संभालने मे Compatible बनाते है.
जब आप Sass के साथ काम करना शुरू करते है तो यह आपकी Preprocessed Sass File ले जाएगा और इसे एक साधारण सीएसएस फ़ाइल के रूप मे Save कर लेता है और जिसे बाद मे आपके WebPage मे उपयोग किया जाता है.
आम तौर पर एचटीएमएल एक Clear Nested और Scene Hierarchy में लिखा जाता है जबकि सीएसएस नही होता है. Sass आपको अपने सीएसएस चयनकर्ता को ऐसे तरीके से Nest करने मे मदद करता है जो आपके एचटीएमएल के समान Scene Hierarchy का पालन करता है. Nest के दौरान आपको बहुत सावधान रहना चाहिए क्योंकि अत्यधिक nest वाले नियम जटिलता का कारण बन सकते है और यह बनाए रखने के लिए कठिन साबित होता है.
Sass Mixins आपको CSS Declarations के समूह बनाने की सुविधा प्रदान करता है जिन्हें आप अपनी साइट पर बार-बार पुन उपयोग करना चाहते है. आप Mixins को अधिक Flexible बनाने के लिए अपनी आवश्यकता के हिसाब से Value को भी पारित कर सकते है.
Mixed Code लिखने से बचने के लिए मिश्रित एकाधिक मान या पैरामीटर और कॉल फ़ंक्शन स्टोर कर सकता है. Mixin नाम अंडरस्कोर और हाइफ़न का एक-दूसरे का उपयोग कर सकते है.