Working with the web fonts in Chapter 8

In Chapter 8, on page 326, under the Step 4: Add the @font-face property to your CSS subheading, the book asks you to add the @font-face code as listed in the text. The problem, however, is that the font doesn't appear as described.

To save the fonts

  1. On your USB flash drive, open the chapter8 folder, open the journal folder, and then create a new folder named fonts.
  2. Right-click the following link: EmblemaOne_Regular.woff.
  3. In the shortcut menu, click Save link as (Chrome and Firefox), Save target as (Edge and Internet Explorer), or Saved linked content as (Opera).
  4. In your browser's Save as dialog box, navigate to the fonts folder you created above, and then click Save to save the EmblemaOne_Regular.woff file.
  5. Repeat steps 2, 3, and 4 with the following link: EmblemaOne_Regular.ttf. Save the EmblemaOne_Regular.ttf file to the same fonts folder.

To make the fonts work

The @font-face rule after referring to local fonts

You should now see the font as shown in the textbook.