title: Load font locally via CSS
body: <p>I have a small static website and I need to move it on an USB to make it possible to open it via this USB.</p>
  
  <p>Via CSS I defined those rules for the fonts (Is a custom font):</p>
  
  <pre><code>@font-face {
    font-family: 'MyFont_SerifReg';
    src: url('/assets/fonts/MyFontSerifReg.ttf') format('truetype');
    src: url('/assets/fonts/MyFontSerifReg.eot'); /* IE9 Compat Modes */
    src: url('/assets/fonts/MyFontSerifReg.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
    src: url('/assets/fonts/MyFontSerifReg.woff') format('woff'); /* Pretty Modern Browsers */
  }
  
  @font-face {
    font-family: 'MyFont_SansBol';
    src: url('/assets/fonts/MyFontSansBol.ttf') format('truetype');
    src: url('/assets/fonts/MyFontSansBol.eot'); /* IE9 Compat Modes */
    src: url('/assets/fonts/MyFontSansBol.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
    src: url('/assets/fonts/MyFontSansBol.woff') format('woff'); /* Pretty Modern Browsers */
  }
  
  @font-face {
    font-family: 'MyFont_SansLig';
    src: url('/assets/fonts/MyFontSansLig.ttf') format('truetype');
    src: url('/assets/fonts/MyFontSansLig.eot'); /* IE9 Compat Modes */
    src: url('/assets/fonts/MyFontSansLig.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
    src: url('/assets/fonts/MyFontSansLig.woff') format('woff'); /* Pretty Modern Browsers */
  }
  
  @font-face {
    font-family: 'MyFont_SansDem';
    src: url('/assets/fonts/MyFontSansDem.ttf') format('truetype');
    src: url('/assets/fonts/MyFontSansDem.eot'); /* IE9 Compat Modes */
    src: url('/assets/fonts/MyFontSansDem.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
    src: url('/assets/fonts/MyFontSansDem.woff') format('woff'); /* Pretty Modern Browsers */
  }
  
  body {
    font-family: 'MyFont_SansLig';
  }
  
  h2 {
    font-family: 'MyFont_SerifReg';
    font-size: 40px !important;
  }
  
  h4 {
    font-family: 'MyFont_SansBol';
    line-height:1.5em;
  }
  
  p {
    font-family: 'MyFont_SansLig';
    font-size:16px;
  }
  
  b {
    font-family: 'MyFont_SerifReg';
    font-size:18px;
  }
  </code></pre>
  
  <p>And I have no problem to load the fonts while visiting the website via We</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>A screen from the Console, Looks like the "fonts" folder is not loaded in "Sources"</p>
  
  <p><a href="https://i.stack.imgur.com/bxdTr.png" rel="nofollow noreferrer">Console</a></p>
  
  <p>The problem appears only when I try to load the website in Local: the font's are not loaded.</p>
  
  <p>What am I writing wrong?</p>