在網頁中使用 @font-face 規則嵌入字體，前提是可以從你的網站或第三方 Web 服務器下載到相應的字體。以這種方式提供的字體，會在使用該字體的頁面第一次加載時被瀏覽器下載并緩存起來，以后就不用下載了。但是，除了顯示網頁之外，用戶不能將這種字體用于其他用途。下面就是 Font Squirrel為 Ubuntu Titling Bold字體生成的 @font-face 代碼。對于其他來源的字體，這種格式也是適用的。

@font-face {font-family:'UbuntuTitlingBold';/*這就是將來在字體棧中引用的字體族的名字*/src: url('UbuntuTitling-Bold-webfont.eot'); /* IE9*/src: url('UbuntuTitling-Bold-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */url('UbuntuTitling-Bold-webfont.woff') format('woff'), /* chrome, firefox */url('UbuntuTitling-Bold-webfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/url('UbuntuTitling-Bold-webfont.svg#UbuntuTitlingBold') format('svg'); /* iOS 4.1- */font-weight: normal;font-style: normal; }

　　

轉載于:https://www.cnblogs.com/luyuefeng/p/8510418.html

總結

以上是生活随笔為你收集整理的打包的@font-face包的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。