Olubunmi
Olubunmi

Reputation: 91

How to use fonts in my website

I am trying to use some fonts on my website but it taking effect. I created a folder for the fonts of my website and added the fonts inside the folder... ..ttf files

then inside the css file I added this :

@font-face {
font-family: Lato;
src: url(http://www.types4u.org/n/font/Lato.ttf) format("truetype");
font-family: Arbutus;
src: url(http://www.types4u.org/n/font/Arbutus.ttf) format("truetype");
font-family: Actor;
src: url(http://www.types4u.org/n/font/Actor.ttf) format("truetype");
font-family: LeagueGothic;
src: url(http://www.types4u.org/n/font/LeagueGothic.ttf) format("truetype");
font-family: LibreBaskerville;
src: url(http://www.types4u.org/n/font/LibreBaskerville.ttf) format("truetype");
}

Site Here

Upvotes: 0

Views: 517

Answers (1)

Ben Kugler
Ben Kugler

Reputation: 342

Are you sure you're setting the font later on? The code you posted will make the fonts available to you, but it won't use them except where you tell it to. Assuming you have done that and it's still not displaying, I would be tempted to just use Google Fonts with the Google Fonts API. So, for the Lato font, you would include

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

in the <head> of your HTML. Then, to make a h1 have that font, all you need is

h1 {
  font-family: 'Lato', sans-serif;
}

At least, that's what I think you're asking. If you can be more specific or provide more context/code, you'll likely have more people helping you.

Upvotes: 1

Related Questions