Import a Google Font1234

Import a Google Font1234
0

#1

Tell us what’s happening:

Why do you have to call google to use a font? whats the the point, and why google?

Your code so far

<style>
  .red-text {
    color: red;
  }
  h2 {
    font-size: 16px;
    font-family: Lobster;
  }
  p {
    font-size: 16px;
    font-family: Monospace;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36.

Link to the challenge:

  • List item

#2

There are only few fonts that are implemented by default in all browsers, making them safe and compatible to use, called web safe fonts.

A lot of times however, you want to use some custom font to make the design of your page more appealing, so you need your webpage to load the desired fonts with it.

You can do it by either uploading your custom font file with your website asset (same as you would do with an image, for example) or use a 3rd party service that host that font somewhere on the web for you to use.

Just happens that Google Fonts is giving you a lots of fonts to use for free, hence why it was chosen.
Another popular option is Adobe’s typekit

Hope it helps :slight_smile: