We can then use the fonts in the stylesheets as you would use any other font. Let’s practice loading an external font in our stylesheets using the
@font-face property, and using the font to style our page.
In index.html remove the link to the
Space Mono font that you added in the previous exercise.
Now, add this same font to style.css using the
@font-face rules labeled latin.
Recall that in order to do this, we use the same CSS rules returned in the browser for the
Space Mono font, and copy the latin
@font-face rules to the top of the stylesheet.
If you need help retrieving the link for the appropriate font, click here.
Once you add the font, you’ll notice that the elements styled in the
Space Mono font retain the correct font styling.