How to insert specific fonts into the CSS?

Asked

Viewed 1,500 times

2

My client passed specific fonts to a website. These are in TTF format.

inserir a descrição da imagem aqui

I’m used to using Google fonts and there’s no fonts there.

How can I use these fonts in my CSS or HTML?

javascript html css html5 css3
  • 2

    If you are the one listed above, you can find here: https://fonts.google.com/specimen/Raleway - Desktop-ready TTF is not necessarily the most suitable or efficient format for CSS. And if you are using a source that is not licensed for free use, remember to take the appropriate steps to license correctly.

  • 2

    TTF fonts don’t work in IE or Safari.

  • @Bacco can put yours as the answer, which worked better. So mark as the right answer. Thank you.

  • @Branches the solution is already in the closing link above, but your question will serve as an index to help other people searching for similar keywords. I’m glad it worked out, any doubt opens a new question or comment.

  • Well, by your choice, I think the question should be Onde acho essas fontes? and not Como posso utilizar estas fontes em meu CSS ou HTML?

1 answer

3


Post your fonts to the server. Example raleway-bold.ttf

CSS

@font-face {
    font-family: ralewayExtralight;
    src: url(raleway-extralight.ttf);
}


@font-face {
    font-family: ralewayBold;
    src: url(raleway-bold.ttf);
}

.Extralight {
    font-family: ralewayExtralight;
}

.Bold {
    font-family: ralewayBold;
}

HTML

<p class="Extralight">Estilo de font importada: raleway-extralight.ttf</p>

<p class="Bold">Estilo de font importada: raleway-bold.ttf</p>

Appearance in browsers:

Google Chrome:

Google Chrome

Firefox:

Firefox

Opera:

Opera

Safari:

Safari

Internet Explorer:

IE

Browser other questions tagged javascript html css html5 css3

You are not signed in. Login or sign up in order to post.