Book Image

Less Web Development Cookbook

Book Image

Less Web Development Cookbook

Overview of this book

Table of Contents (19 chapters)
Less Web Development Cookbook
Credits
Foreword
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Generating font-face declarations with Clearless


The @font-face CSS rule allows authors to specify fonts that are not installed on the user's system to display text on their web pages.

Getting ready

For this recipe, you will need to generate the EOT, WOFF, and TTF formats of a font. You can use, for instance, the Webfont generator at http://www.fontsquirrel.com/tools/webfont-generator to get the different formats of a TTF font file. You should save the generated font files with the same name and different extension in your working directory. Make sure you do not choose any copyrighted fonts unless you are willing to pay for it.

You can inspect the fonts in your browser, so use the client-side less.js compiler, as described in the Downloading, installing, and integrating less.js recipe in Chapter 1, Getting to Grips with the Basics of Less, to compile the Less code of this recipe in your browser. The Less code will use mixins from the Clearless library.

How to do it…

  1. Start with downloading and...