Search code examples
cssangularangular7angular8

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


Solution

  • 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;
    }