需要帮助从Azure加载字体到网页

Question

我有麻烦从Azure加载我的字体到我的css/html，使它们不出现在我的页面上。这是我的代码

CSS:@font-face {
font-family: 'DTLArgo-Bold';
src: url('../fonts/dtlargot-bold-webfont.eot');
src: url('../fonts/dtlargot-bold-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/dtlargot-bold-webfont.woff') format('woff'),
     url('../fonts/dtlargot-bold-webfont.ttf') format('truetype'),
     url('../fonts/dtlargot-bold-webfont.svg#dtl_argot_bold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'dtl_argot_regular';
src: url('../fonts/dtlargot-webfont.eot');
src: url('../fonts/dtlargot-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/dtlargot-webfont.woff') format('woff'),
     url('../fonts/dtlargot-webfont.ttf') format('truetype'),
     url('../fonts/dtlargot-webfont.svg#dtl_argot_regular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'DTLArgoT-Light';
src: url('../fonts/dtlargot-light-webfont.eot');
src: url('../fonts/dtlargot-light-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/dtlargot-light-webfont.woff') format('woff'),
     url('../fonts/dtlargot-light-webfont.ttf') format('truetype'),
     url('../fonts/dtlargot-light-webfont.svg#dtl_argot_light') format('svg');
font-weight: normal;
font-style: normal;
}
.font{
font-family: DTLArgoT-Light, Arial, sans-serif;
}

Azure Web.config:
<?xml version="1.0"?>
<configuration>
<system.web>
    <compilation debug="false" targetFramework="4.0" />
</system.web>
<system.webServer>
    <modules runAllManagedModulesForAllRequests="true"/>
<staticContent>
  <mimeMap fileExtension=".mp4" mimeType="video/mp4" />  
  <remove fileExtension=".svg" />
  <remove fileExtension=".eot" />
  <remove fileExtension=".woff" />
  <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />
  <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
  <mimeMap fileExtension=".woff" mimeType="application/x-woff" />
</staticContent>    
</system.webServer>
 </configuration>

我的文件结构是根然后两个文件夹，一个叫做字体(字体)和另一个css(css)。任何帮助都会很感激。谢谢! !

Answer 1

您是使用Azure网站、Azure Webrole还是Azure虚拟机?您正在使用纯HTML或ASP进行开发吗?. NET、PHP还是Node?

假设你在网站上，你必须改变一个名为web.config的文件，它位于你的网站的网站文件夹。

这是一个非常简单的web示例。注册WOFF文件以供Azure网站服务的配置:

<configuration>
    <system.webServer>
        <staticContent>
            <mimeMap fileExtension="woff" mimeType="application/font-woff" />
        </staticContent>
    </system.webServer>
</configuration> 

您可能还想为您使用的所有web字体扩展添加mimeMap。但要注意选择正确的mime类型，因为它可能不起作用。例如，大多数用户添加application/x-font-woff，它可能不为他们工作，因为RFC，现在是最终状态，它应该是application/font-woff。