I need to use specific Font in ASP.NET Core MVC Project, So, in css file:
CSS:
@font-face {
font-family: "CustomFont";
src: url(css/Custom-VariableFont_slnt.ttf);
}
But I get error that the font path is invalid
I tried to change it like:
url(~/Custom-VariableFont_slnt.ttf);
or
url(https://localhost:7267/css/Custom-VariableFont_slnt.ttf);
or
url(../css/Custom-VariableFont_slnt.ttf);
But always I get the same error:
Failed to load resource: the server responded with a status of 404 ()
Firstly you need confirm the following things:
Ensure that your font file (Custom-VariableFont_slnt.ttf) is located in the wwwroot/css
folder.
Ensure your Startup.cs
or Program.cs
(for .NET 6/7/8) is configured to serve static files:
app.UseStaticFiles(); //be sure the middleware order
app.UseRouting();
app.UseAuthorization();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
app.Run();
Then, the wwwroot
folder is the root for static files, the path should be relative to it by using /css/Custom-VariableFont_slnt.ttf
:
@font-face {
font-family: "CustomFont";
src: url(/css/Custom-VariableFont_slnt.ttf);
}