Asp.net

在網頁中嵌入字型

  • July 29, 2012

我搜尋了很多試圖找出如何在網頁上嵌入字型的方法。據我了解,您應該以 .ttf 和 .eot 格式將字型上傳到您的網頁。並在樣式表中使用@font-face。

我已將 Kingthings_Italique.eot 和 Kingthings_Italique.ttf 放在我網頁的根目錄中。

創建一個這樣的樣式表。

.MyStyle
{   
   /* For IE */
   @font-face 
   {
       font-family: 'Kingthings Italique';
       src: url('Kingthings_Italique.eot');
   }

   /* For Other Browsers */
   @font-face 
   {
       font-family: 'Kingthings Italique';
       src: local('Kingthings Italique Regular'),
            local('KingthingsItalique-Regular'),
            url('Kingthings_Italique.ttf') format('truetype');
   }
}

首先我這樣稱呼它

<head runat="server">
   <link href="StyleSheet.css" rel="stylesheet" type="text/css" />

我試著像這樣使用它

<asp:Label ID="lbl" runat="server" Font-Bold="True" 
       Font-Size="30pt" Text="TEST123" CssClass="MyStyle"></asp:Label>

但無論我使用 ie8 還是 chrome2,字型都不會改變。

如果我理解http://randsco.com/?p=680&more=1&c=1正確應該是可能的

如果我在 ie8 中打開原始碼,我應該能夠看到字型名稱嗎?因為如果我通過 ie8 程式碼搜尋 king 我什麼也找不到

為了使嵌入字型功能正常工作(在支持它的瀏覽器中),您還必須將新的字型系列應用於樣式選擇器。

例如

h1 { 
 @font-face {
font-family: CustomFont;
src: url('CustomFont.ttf');
 }
}

不會成功,即使它確實會載入字型(如果它是有效的 URL)——因為我們所做的只是載入字型。我們仍然需要實際應用它,所以

@font-face {
 font-family: CustomFont;
 src: url('CustomFont.ttf');
}

h1 {
 font-family: CustomFont;
} 

兩者都載入自定義字型並將其應用於您的 CSS 選擇器(在本例中為 h1)。

您幾乎肯定會想閱讀有關@font-face 的教程(Krule 已經在上面推薦了一個很好的教程,其中包含可以與它一起使用的免費字型的連結。)同上上面關於優雅退化的所有警告,因為這是仍然不是普遍支持的功能。

引用自:https://stackoverflow.com/questions/1382886