@font-face c# MVC Bootstrap

Asked

Viewed 608 times

0

I have a Bootstrap template that I’m trying to apply to a project, but I have a huge difficulty importing the . eot, . svg. ttf, . Woff, . otf

These files are in the directory: NomeProjeto\Content\fonts

My . css file I call tries to use these files is in the directory: NomeProjeto\Content\fonts.

I’m trying to reference it this way: 

@font-face {
    font-family: 'FontAwesome';
    src: url('../fonts/fontawesome-webfont.eot?v=4.2.0');
    src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?              v=4.2.0#fontawesomeregular') format('svg'); font-weight: normal;
    font-style: normal;
}

inserir a descrição da imagem aqui inserir a descrição da imagem aqui

Guys, any idea?

Thank you.

c# asp.net-mvc bootstrap css-font-face

  • If your css file is in the same directory as the fonts directory, you do not need to add the ".. /" before the path. In my view this is it. I don’t quite understand your doubt.

2 answers

1

To add the additional settings you want you need to access the App_start folder and in the file: "Bundleconfig.Cs". add the CSS or JS files you want.

0

Since the resolution of references is done by route, and not by static directory, you need to configure the application to allow static paths by file type. This is done by putting the following in the Web.config:

<configuration>
  ...
  <system.webServer>
    ...
    <staticContent>
      <remove fileExtension=".woff" />
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
      <remove fileExtension=".woff2" />
      <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff2" />
      <remove fileExtension=".ttf" />
      <mimeMap fileExtension=".ttf" mimeType="font/truetype" />
      <remove fileExtension=".otf" />
      <mimeMap fileExtension=".otf" mimeType="font/opentype" />
      <remove fileExtension=".eot" />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <remove fileExtension=".json" />
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>
    ...
  </system.webServer>
  ...
<configuration>

Another thing is that you don’t need to reference the files from the description of @font-face by relative directory. You can do so:

@font-face {
    font-family: 'FontAwesome';
    src: url('/fonts/fontawesome-webfont.eot?v=4.2.0');
    src: url('/fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('/fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('/fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('/fonts/fontawesome-webfont.svg?              v=4.2.0#fontawesomeregular') format('svg'); font-weight: normal;
    font-style: normal;
}

Browser other questions tagged c# asp.net-mvc bootstrap css-font-face

You are not signed in. Login or sign up in order to post.