Peter Penzov
Peter Penzov

Reputation: 1588

How to load a font file from css file into Angular project

I have this project with fonts, images and CSS files under the folder assets:

enter image description here

How I can import the fonts into this CSS file?

@font-face {
    font-family: lg;
    src: url(./assets/fonts/lgd641.eot?n1z373);
    src: url(./assets/fonts/lgd41d.eot?#iefixn1z373) format("embedded-opentype"), url(./assets/fonts/lgd641.woff?n1z373) format("woff"), url(./assets/fonts/lgd641.ttf?n1z373) format("truetype"), url(./assets/fonts/lgd641.svg?n1z373#lg) format("svg");
    font-weight: 400;
    font-style: normal;
}

Now I get not found.

enter image description here

Upvotes: 1

Views: 1199

Answers (2)

Alexander Staroselsky
Alexander Staroselsky

Reputation: 38777

Try changing the paths to the following:

@font-face {
    font-family: lg;
    src: url(assets/fonts/lgd641.eot?n1z373);
    src: url(assets/fonts/lgd41d.eot?#iefixn1z373) format("embedded-opentype"), url(assets/fonts/lgd641.woff?n1z373) format("woff"), url(assets/fonts/lgd641.ttf?n1z373) format("truetype"), url(assets/fonts/lgd641.svg?n1z373#lg) format("svg");
    font-weight: 400;
    font-style: normal;
}

Upvotes: 1

Manish Sharma
Manish Sharma

Reputation: 249

you can use ../fonts/file-name path to the font directory in place of ./assets/fonts in css file.

Upvotes: 0

Related Questions