If you work in the digital industry, you have probably heard the term SASS being used by developers and designers.So, what exactly is SASS, and why is everybody talking about it? Here is the one stop shop guide to SASS.
SASS stands for Syntactically Awesome Style Sheets (yes, really!) and is a CSS pre-processor. This means that it allows developers to write in SASS and then compile the code into regular CSS that can be used in the browser.
SASS is effectively a CSS extension that enables additional features that are not available in conventional CSS, such as nesting, variables and inline code imports, among other features.
At this point, it is worth pointing out that SASS has the benefits of efficiency and speed over conventional CSS. That said, SASS is built on CSS, so for people who are new to web development, to get the most out of SASS, they should get up to speed with CSS, before delving into SASS.
Variables
So just like in conventional programming, variables allow us to store information for use later on. In SASS, we could define a hexadecimal colour as a variable and then refer to it later in the code wherever the colour is required.The key advantage is that if the colour hex was to change, we would only need to update the variable once. Whereas, using conventional CSS, the colour hex would have to be changed in every instance it is used.
Another area where SASS variables can come in handy, is for image paths. In this example, we can see the background image has an absolute URL, which can be changed at variable level, should the domain name ever change in the future.
To view the full article, please check it out over at The Digital Den.
Image credit: SASS Lang
Comments
Post a Comment