HTML

The Google Font API`s i Shorthand

In this fourth part of the series, I demonstrate how to work with the “i” option provided by the Google Font API. It can be used as a shorthand for the “italic” argument discussed in previous tutorials. The process is extremely straightforward, so you shouldn’t have major problems replicating it when developing your own web pages.

As you may have already guessed, using the “i” shorthand for downloading the italic style of a given font family is very similar to specifying the whole term “italic” discussed previously. What’s more, the process is as simple as querying Google’s Font API using the following format:

That was a breeze to code, right? As one might expect, the task of the “i” shorthand is to shorten the syntax required for requesting the style of a specific font family. In the above code sample, the shorthand has been appended to the name of the font being downloaded, which instructs the API to serve only the italic version of the font. Once the request has been successfully completed, the typeface(s) can be used normally to style the desired HTML elements, as shown below:

h1 {

font: normal 46px 'Cantarell', Helvetica, sans-serif;

color: #00f;

}

h2 {

font: normal 40px 'Cantarell', Helvetica, sans-serif;

color: #ff8040;

}

h3 {

font: normal 32px 'Cantarell', Helvetica, sans-serif;

color: #ff8040;

}

p {

font: normal 14px 'Nobile', Helvetica, serif;

}

Since the earlier CSS styles are so easy to follow, they don’t bear any further discussion. Now it’s time to include them in a web page, so you can see for yourself the actual functionality of the previous “i” shorthand.

This will be done in the coming segment; click on the link below and read the following lines.