css3-11 網頁如何使用自定義字體

時間 2020-05-31

標籤 css3 css 網頁如何使用自定義字體欄目 CSS 简体版

原文原文鏈接

css3-11 網頁如何使用自定義字體

1、總結

一句話總結：下載好字體文件，而後在網頁中引入，用src: url('my.otf');來引入，使用的時候就使用本身定義的名字來使用這個字體。

一、網頁如何使用自定義字體？

下載好字體文件，而後在網頁中引入，用src: url('my.otf');來引入，使用的時候就使用本身定義的名字來使用這個字體。css

聲明

 7  @font-face  8 {  9  font-family: my; 10  src: url('my.otf'); 11 }

使用

13  *{ 14  font-family: my; 15 }

二、聲明網頁使用字體文件在哪裏聲明，聲明的關鍵詞是什麼？

在style裏面html

@font-face

三、聲明字體爲了解決什麼問題？

網頁中的字體用戶電腦沒有，服務器上也沒有的問題linux

如今只要網站有就能夠啦css3

四、如何使用聲明的字體？

聲明字體的時候會指定名字，用的時候直接使用這個名字就能夠了服務器

 7  @font-face  8 {  9  font-family: my; 10  src: url('my.otf'); 11 } 12 13  *{ 14  font-family: my; 15 }

2、網頁如何使用自定義字體

一、相關知識

字體樣式:
@font-face
{
font-family: fzm;
src: url('fzm.ttf');
}

二、代碼

自定義字體類型

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>index</title>
 6     <style>
 7  @font-face  8         {
 9  font-family: my;
10  src: url('my.otf');
11         }
12 
13  *{
14  font-family: my;
15         }
16         
17  div{
18  width:500px;
19  height:300px;
20         }    
21 
22     </style>
23 </head>
24 <body>
25     <div>
26         <p>我是小金，我愛睡覺!</p>
27         <p>linux is very much!</p>
28         <p>linux is very much!</p>
29         <p>linux is very much!</p>
30         <p>linux is very much!</p>
31     </div>
32 </body>
33 </html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。