CSS 可以用來控制網頁的樣式,其中一個重要的功能是讓網頁中的文字使用自定義的字體。在本地加載字體時,需要使用@font-face 屬性以及<pre>
標簽。
首先,我們需要在網頁中定義一個字體文件的路徑。使用@font-face 屬性,可以將這個路徑添加到樣式表中。
@font-face { font-family: "MyFont"; src: url("fonts/MyFont.ttf") format("truetype"); }
在這個例子中,我們定義了自定義字體的字體名稱為"MyFont",字體文件的路徑為"fonts/MyFont.ttf",字體文件的格式為TrueType (.ttf)格式。
然后,我們需要在樣式表中使用這個定義的字體。可以將字體名稱作為屬性的值,將值賦給元素的"font-family" 屬性。
body { font-family: "MyFont"; }
在這個例子中,我們將整個頁面的字體設置為"MyFont"。
最后,將字體文件的存儲路徑與網頁文件存儲在同一個目錄中。
使用 CSS 加載本地字體需要注意以下幾點:
- 使用字體文件的完整路徑(相對路徑或絕對路徑)
- 使用對應字體格式的@font-face 屬性(比如TrueType格式使用format("truetype"))
使用這些知識,我們就可以在網頁中自定義字體樣式。