Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS import fonts from otf

Tags:

html

css

fonts

guys, I'm having trouble with importing fonts from an otf file

main.css

@font-face {
    font-family: 'testfont';
    src: url('fonts/test.otf');
}

.fonttest {
    font-family: 'testfont';
}

main.html

<p class="fonttest">TESTtest</p>

But still when I try start the homepage it shows the standard font of html. When I use the inspector on my browser opera and chrome it says that the font was accepted

like image 815
Stephan Pich Avatar asked Nov 01 '17 12:11

Stephan Pich


People also ask

How do I use an OTF font in CSS?

Add a font-face section to your CSS code src: url('fonts/lovely_font. otf') format('opentype'); src: url('fonts/lovely_font. ttf') format('truetype'); As another optional efficiency measure, we can get the browser to check for a local copy of the font in case the user already has it.

Can I use OTF instead of TTF?

There is really no issue for the end user as almost all modern applications that uses fonts are able to work with TTF and OTF files. Users don't need to choose one over the other as they can be used together in creating documents or printing layouts.


1 Answers

use this;

@font-face {
    font-family: testfont;
    src: url("fonts/test.otf") format("opentype");
}
like image 145
Dev.aaron Avatar answered Oct 06 '22 22:10

Dev.aaron