Join Joe Marini for an in-depth discussion in this video Using the exercise files, part of CSS with LESS and Sass.
If you are a premium member of the lynda.com online training library, or if you're watching this tutorial on a DVD-ROM, you have access to the exercise files used throughout this title. I have laid out the exercise files in a series of chapters, you can see here in the Exercise Files folder. Each one of these chapters contains a collection of files that we use in each one of the exercises. So for example, here in chapter 1, we have a collection of files that we use for that particular chapter, and these correspond to the movies that you're watching in the title.
I've also included a file called ExampleSnippets.txt. This contains all of the code that I used to build the finished examples in this title. So even if you're not a premium member of the online training library, this file is provided to you for free, so you still have access to all the code snippets. Let's jump into the code editor really quick, so you can see what this looks like. So this is the file of the ExampleSnippets, and you can see that it's organized according to each chapter. So throughout the title I'm going to scroll down to the particular point in this file where the snippets are used in that particular chapter.
So for example, here in Chapter 1, I have our first example, and I'll just be copying and pasting this code directly from the ExampleSnippets into the finished example files; this way you don't have to sit there and watch me type. Now, if you're a monthly member, or an annual member of lynda.com, you don't have access to the exercise files, but of course you can still follow along from scratch with your own assets, and as I said, you have access to the ExampleSnippets.txt file. Alright, let's get started.
The first section focuses on LESS (Leaner CSS) and how it can be used on both the client and the server. The lessons show how to work with variables, mixins, nested rules, and other features to easily create maintainable CSS.
The second section introduces Sass (Syntactically awesome stylesheets), which contains many of the same features as LESS, along with a few new ones. Joe also compares and contrasts the two tools, and explains how your platform and needs may influence which tool you choose.
- What are LESS and Sass?
- Using variables in your CSS
- Working with reusable and parameterized mixins
- Implementing nested rules
- Combining CSS rules with operations
- Using the built-in functions in LESS and Sass
- Controlling the CSS output formatting
- Importing external files