@ font-face c # MVC Bootstrap

0

I have a Bootstrap template that I'm trying to apply to a project, but I have a huge problem importing the .eot, .svg, .ttf, .woff, .otf files

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

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

I'm trying to reference it as follows:

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

Personal, any ideas?

Thank you.

    
asked by anonymous 11.08.2016 / 21:35

2 answers

1

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

    
12.12.2017 / 23:04
0

Because referencing is done by route, not by static directory, you need to configure the application to allow static routes by file type. This is done by placing the following in 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 do not need to reference the description files of @font-face per relative directory. You can do this:

@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;
}
    
23.09.2016 / 15:06