WebFont @ font-face defines serif / sans-serif / monospace

I use many web fonts on my site, and now I want to add a new font family with the serif / sans-serif / monospace font. Part of my css:

@font-face {
    font-family: 'DejaVu', sans-serif;
    font-weight: 400;
    font-style: normal;
    src: url(dejavu/DejaVuSans.ttf)
}
@font-face {
    font-family: 'DejaVu', monospace;
    font-weight: 400;
    font-style: normal;
    src: url(dejavu/DejaVuSansMono.ttf);
}
@font-face {
    font-family: 'DejaVu', serif;
    font-weight: 400;
    font-style: normal;
    src: url(dejavu/DejaVuSerif.ttf);
}

But this does not work (in the css console I see an error, for example: bad value for a font family). Is there a way to make it work using only one name for the font.

I know that I can change the name of the font family to look like this: "DejaVu Serif", but I don't want to.

+4
source share
1 answer

The answer is no, the only way would be to change the name font-familyto include the font definition.

font-style font-weight , font-face, font-face.

+2

Source: https://habr.com/ru/post/1609261/


All Articles