首頁 > web前端 > css教學 > CSS怎麼引用外部ttf字體?

CSS怎麼引用外部ttf字體?

青灯夜游
發布: 2019-05-23 18:17:58
原創
10543 人瀏覽過

CSS怎麼引用外部ttf字體?

CSS如何引用外部字體?

在CSS中可以使用font-face屬性來引用外部字體,font-face屬性可實現任何外部特殊字體的調用,例如:.ttf字體。

在新的 font-face 規則中,必須先定義字體的名稱(例如 myFirstFont),然後指向該字體檔案。

如需為HTML 元素使用字體,請透過font-family 屬性來引用字體的名稱(myFirstFont).

font-face屬性引用ttf字體範例:

範例1:

<style> 
@font-face
{
font-family: myFirstFont;
src: url(&#39;aa.ttf&#39;),
     url(&#39;aa.eot&#39;); /* IE9+,可以是具体的实际链接 */
}
div
{
font-family:myFirstFont;
}
</style>
登入後複製

範例1:

@font-face
{
font-family: myFirstFont;
src: url(&#39;aa.ttf&#39;),
     url(&#39;aa.eot&#39;); /* IE9+ */
font-weight:bold;
}
登入後複製

#font-face屬性對瀏覽器的支援:

Firefox、Chrome、Safari 以及Opera 支援.ttf (True Type Fonts) 和.otf (OpenType Fonts) 類型的字型。

Internet Explorer 9 支援新的 font-face 規則,但僅支援 .eot 類型的字型 (Embedded OpenType)。

以上是CSS怎麼引用外部ttf字體?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
css
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板