Book Image

Learning less.js

Book Image

Learning less.js

Overview of this book

Table of Contents (22 chapters)
Learning Less.js
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Using @font-face with Less


A downside of using fonts in web pages is that they must exist on your end user's PC or laptop. Naturally, with the mix of PC, laptop, and mobile devices now available in the market, it would be almost impossible to guarantee that the font will exist!

I say impossible; there are fonts that we can use on a PC or laptop, such as Arial, Times New Roman, or Verdana; they are not bad fonts, but they are overused and not particularly special. We could, of course, use an external service, such as Google Fonts—as we did in the Creating simple font mixins section earlier in this chapter.

However, we can do better than this by using @font-face to embed any font in our pages. I say any, but the license for the font must allow embedding in a page. Thankfully, if we use a site such as Font Squirrel (as we will do in the next exercise), we can easily check and eliminate any fonts that fall outside this criteria, when choosing a font.

Enough of the talking; let's turn our attention...