Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Importing a google font on freecodecamp.com

I'm doing the 15th lesson on freecodecamp.com but I cannot seem to complete it. The objective is to make my h2 element use the font 'Lobster' while keeping Monospace. I'm supposed to copy,"http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>". Here is the code I wrote:

<style>
  .red-text {
    color: red;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }
</style>

<style>
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
</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>
like image 401
Lescott Makiwa Avatar asked Jun 27 '26 22:06

Lescott Makiwa


1 Answers

<head>
      <link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
  <style>
       .red-text {
       color: red;
       }

     p {
         font-size: 16px;
         font-family: Monospace;
       }

    h2 { 
         font-size: 16px;
         font-family: Lobster; 
       }
  </style>
</head> 

    <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>

The above code help me get to the next step. I had initially put the call for the lobster font in the CSS style, oops! Finally I found this site and the following link (https://developers.google.com/fonts/docs/getting_started) to help me realize that I needed to create a head before the style and put the call in there (head), copied and pasted from the instructions of course.

like image 106
Will Irvin Avatar answered Jun 30 '26 13:06

Will Irvin



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!