CSS - Не удается разрешить локальный файл ttf?

Question

Хорошо, распространенная проблема - просто попытка включить собственный шрифт. Я пробовал несколько методов, в том числе:

@font-face {
    font-family: SequelSansBlackDisp;
    src:"./src/resources/SequelSansBlackDisp.ttf";
}
@font-face {
    font-family: SequelSansLightDisp;
    src:"./src/resources/SequelSansLightDisp.ttf";
}

и

@font-face {
    font-family: SequelSansBlackDisp;
    src:url("./src/resources/SequelSansBlackDisp.ttf");
}
@font-face {
    font-family: SequelSansLightDisp;
    src:url("./src/resources/SequelSansLightDisp.ttf");
}

Безрезультатно. Первый ничего не делает, в то время как второй доктор aws «не может разрешить» ошибки. Шрифт находится прямо в папке ресурсов - я переименовал файл ttf, чтобы убрать пробелы. Может быть, это проблема? Откуда мне знать, как правильно ссылаться на файл ttf?

Answer 1

Вы можете попробовать это.

@font-face {
    font-family: SequelSansBlackDisp;
    src:url('./src/resources/SequelSansBlackDisp.ttf') format('truetype');
}
@font-face {
    font-family: SequelSansLightDisp;
    src: url('./src/resources/SequelSansLightDisp.ttf') format('truetype');
}

Answer 2

попробуйте это решение:

@font-face {
  font-family: fontName;
  font-style: normal;
  font-weight: normal;
  url('/static/fonts/dir/font_name.ttf') format('truetype');
}