| 7 | Defining Variables |
Have you ever been in a situation where you are copying the value of a color over and over again? That specific blue appears in so many places. Then, a couple of weeks later, you need to change the color. Or—even worse—you have a whole lot of colors to change. Find-and-replace time!
Sass introduces variables to help us manage problems like this. All variables in Sass are prefixed with a $ sign. Assigning a variable looks a lot like typing in a CSS property. For instance, you can set the $primary_color variable by adding the super-simple line: $primary_color: #369;. That’s it!
To use the variable, just use the variable name where you’d usually use the property value. If you have to change the colors of the whole document, ...
Get Pragmatic Guide to Sass 3 now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
