From the course: Responsive CSS Workflow with Sass, Bourbon, and Susy
Unlock the full course today
Join today to access over 22,500 courses taught by industry experts or purchase this course individually.
How Sass works
From the course: Responsive CSS Workflow with Sass, Bourbon, and Susy
How Sass works
- How exactly does Sass work its magic? Well, it does it through variables, nesting, even math, mixins, and then a lot of various functions. I'm going to use a site called codepin to show you some of these examples in action. Codepen is a neat little tool for testing out or showing off front-end code. Anything you can do with HTML, CSS, or JavaScript, you can use Codepen to execute the code and see how it works. All you do is create a new pen, and enter whatever HTML, CSS, or JavaScript that you want, and it'll take that code and output it here in this little window. One thing to note here is that regular browsers cannot read Sass files. They've got to be compiled or turned into regular CSS files. So you've got your Sass files, they go through a processor, and out comes your regular CSS. Now I mentioned that these are some of the things that make Sass so magical. Let's take a quick look at some of these examples in action over at Codepen. We'll start with Sass variables, and I've…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.