freeCodeCamp Challenge Guide: Import a Google Font

freeCodeCamp Challenge Guide: Import a Google Font
0

#1

To import a font from Google or any other site, this is the format that you should follow:

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

Once imported, it can then be used in the font-family property


#2

I still don’t understand


#3

Please create a new topic when you have a question.


#4

It’s still not working. every time, i include the link and run the programme, the p tag is losing its own font-family


#5

Can someone show me the coding for this?Am i supposed to create an h2 element and insert font family exactly how we did it to the p element?Thanks


#6

I put the link at the top but I’m not sure how to apply the family font to h2.


#7
.red-text { color: red; }

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

h2 {
font-size: 16px;
font-family: Lobster; }

CatPhotoApp

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.


#8

Yeah I figured it out thanks though!:grinning:


#9

This works 100%

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

CatPhotoApp

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

Thanking You
Shawn Alexander


#10

-non of these that are shown above work for me? :[.


#11

first of all u have to link it with the specific font family that u want to use and then u have to mention those specific font family property in your stylesheet.


#12
.red-text { color: red; } h2 {font-family: Lobster; } p { font-size: 16px; font-family: Monospace; }

This is actually what the code should like before the style tags and the code in the style tags. If you do like this it will work.


#13

[quote=“susie2268, post:12, topic:18200”]
This is actually what the code should like before the style tags and the code in the style tags. If you do like this it will work.

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

#14

doesnt work either even with everything included :[


#15

That’s odd, it worked for me. Sorry if its not working out for you.


#16

thanks for the code its really working


#17

hey twizzer1030 where did u import that code
inside the style tags??? or somehhere else


#18
<h2 class="red-text"; style="font-family: Lobster";>CatPhotoApp</h2>

It doesn’t work! Why is that???


#19

Try this one. It worked for me :slight_smile:

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

CatPhotoApp

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.


#20
.red-text { color: red; } h2{ font-size:16px; font-family:Lobster; } p { font-size: 16px; font-family: Monospace; }