| 13 | Building a Font Family Library |
In regular CSS, we specify fonts like this:
| | font-family: "helvetica neue", arial, helvetica, freesans, |
| | "liberation sans", "numbus sans l", sans-serif; |
We have to list all our preferred fonts in the order we want them. Then, inevitably, we have to include the most basic serif or sans serif at the end—just in case none of our fonts are available. But if we want to switch between fonts on a page, then we have to copy and paste this list over and over in different places or use ugly, nonsemantic font classes. So much repeated code. We’ve got a simpler way.
We can use variables in Sass! Instead of typing out the list of fonts over and over, define a variable at the top of the page. Then, when you ...
Get Pragmatic Guide to Sass 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.
