嵌入在aspx文件中的@ font-face无效

Question

我想在我的网站上使用一些有趣的字体。但不知何故，字体没有被加载或由于某种原因不起作用。

我有一个母版页，其中有2 <asp:ContentPlaceHolder>个标签。一个在head部分用于类似用途，比如使用外部字体，另一个<asp:ContentPlaceHolder>在body部分。

我尝试了两件事：

1）提供存储在我的visual studio上的字体的URL。

2）其他提供我的文件系统的网址。

这是我的HTML文件：

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <style>
        @font-face{
            font-family:Junction;
            src : url("http:localhost:63183/fonts/Junction.otf") format('opentype');
        }
        @font-face{
            font-family:chunkfive;
            font-weight:bold;
            src : url("f:\practicals7th sem\project docs\templates\temp1\chunkfive.otf") format('opentype');
        }

    </style>
</asp:Content>

这是我的身体部分内容：

<div style="text-align: center; font-family:'Junction.otf' ; font-size: 20px; color: #db2828">
                            <%# Eval("Name") %>

Answer 1

您需要在IIS中设置MimeType：

<system.webServer>
    <staticContent>
        <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
        <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
        <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
        <mimeMap fileExtension=".woff" mimeType="application/x-woff" />
        <mimeMap fileExtension=".otf" mimeType="font/opentype" />
    </staticContent>
</system.webServer>

然后，您可以使用字体的相对路径，即

 @font-face{
            font-family:Junction;
            src : url("/fonts/Junction.otf") format('opentype');
        }
        @font-face{
            font-family:chunkfive;
            font-weight:bold;
            src : url("/fonts/chunkfive.otf") format('opentype');
        }