O'Reilly logo

Responsive Web Design with jQuery by Gilberto Crespo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Exercise 4 – customizing the homepage title

Let's do this exercise in three steps. The second and third steps are just complementary of the first step:

  1. Use Font Squirrel generator to create your font face kit. Then, implement it on the <h1> tag of your site. If you do not have any idea of which font to use, I would recommend to download Kite One font from GoogleFont site.
  2. Use the Lettering plugin to have more control over each letter, word, or line of your title. After that, increase the color of the first letter, changing the color property of the .char1 class from your CSS file.
  3. Use the Kern.js tool by clicking on the link from your bookmarks bar. After that, click on the second button from toolbar and select the first letter to increase its font ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required