CSS: using Google fonts with @import

Google Fonts are a useful feature provided by Google that allows web developers to use web fonts in their pages. Google provides a basic syntax that makes use of the link element to import a given font. However, the same feature can be used using the @import media rule at the very beginning of your style sheet. For example, if we select the Droid Sans font and then we click on the Use this font link, we get the following URL:

http://fonts.googleapis.com/css?family=Droid+Sans

We can use this URL as follows:

@import 'http://fonts.googleapis.com/css?family=Droid+Sans';

If we need to include also other variants of the same font, the only thing we need to do is to modify the above URL as clearly explained on Google's page (we have only to click on a checkbox).

This entry was posted in by Gabriele Romanato. Bookmark the permalink.

Leave a Reply

Note: Only a member of this blog may post a comment.