溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹css如何自定義字體，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
1.行內樣式，最直接最簡單的一種，直接對HTML標簽使用style=""。2.內嵌樣式，就是將CSS代碼寫在之間，并且用
進行聲明。3.外部樣式，其中鏈接樣式是使用頻率最高，最實用的樣式，只需要在之間加上
css自定義字體的方法：1、下載字體文件；2、使用“@font-face”規則和font-family、src屬性來引入字體文件即可，語法“@font-face{font-family: '字體名稱';src:url('文件地址');}”。
本教程操作環境：windows7系統、CSS3版、Dell G3電腦。
我們在瀏覽國外的一些個人網站時，總是可以發現一些非常個性的字體，比如
但是因為在電腦上安裝的字體有限，所以很多時候我們都找不到自己想要的字體，這時候我們就需要使用css3提供的@font-face來實現個性化字體了。
但是說@font-face是css3中的新特性是不準確的，因為在css2中就已經支持了這一特性，ie瀏覽器當時也已經支持它了，只是其他瀏覽器還不支持。而目前，各大瀏覽器都已經支持這個新特性了。具體這個特性怎么使用呢？看下面的代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
@font-face{
font-family:myFont;
src:url('rajdhani-bold.ttf')，url('rajdhani-bold.eot');
}
p{
font-family: myFont;
}
</style>
</head>
<body>
<div>
<p >Ha,those words will be changed.</p>
</div>
</body>
</html>第一：我們需要在css中引入@font-face，在里面使用font-family設置自己想要取的字體名稱，這里我取作myFont（當然也可以是yourFont等等等等）。
第二：我們需要下載自己喜歡的字體。但是應當知道：Firefox、Chrome、Safari 以及 Opera 支持 .ttf (True Type Fonts) 和 .otf (OpenType Fonts) 類型的字體。而Internet Explorer 9+ 支持新的 @font-face 規則，但是僅支持 .eot 類型的字體 (Embedded OpenType)。
Font Squirrel（https://www.fontsquirrel.com/）這個免費的字體資源網站上有很多字體提供下載，上面多是otf和ttf格式的字體。除此之外，defont.com（http://www.dafont.com/）也是一個免費的字體資源網站，下載后的格式一般為ttf。
顯然這兩個網站下載的主要字體都沒有辦法兼容IE瀏覽器。為此，我們可以使用TTF to EOT Font Converter（https://www.kirsle.net/wizards/ttf2eot.cgi）這個字體轉換工具，將ttf格式的字體轉換為eot格式來兼容IE瀏覽器。
但是最好的字體轉換工具還是Font Squirrel提供的generator（https://www.fontsquirrel.com/tools/webfont-generator）， 進入之后選擇expert選項，就可以實現各種字體格式之間的轉換了。
第三：下載之后，通過解壓縮得到文件，并通過字體轉換工具，轉換為兼容IE的eot格式。比如使用src:url("rajdhani-bold.ttf"),url("rajdhani-bold.eot");即可將字體引入，其中url為相對路徑或者是絕對路徑。
第四：這時，我們就可以在css中通過font-family來加入自己的個性化字體了。
這是未使用自定義字體之前的文字：
這是使用了自定義字體之后的文字：
以上是“css如何自定義字體”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
