CSS3 - Web字体（CSS3 - Web font）

优质

小牛编辑

131浏览

2023-12-01

Web字体用于允许CSS中的字体，这些字体未安装在本地系统上。

不同的网络字体格式

Sr.No.	字体和描述
1	TrueType Fonts (TTF) TrueType是Apple和Microsoft在20世纪80年代后期开发的轮廓字体标准，它成为Windows和MAC操作系统最常用的字体。
2	OpenType Fonts (OTF) OpenType是可缩放计算机字体的格式，由Microsoft开发
3	The Web Open Font Format (WOFF) WOFF用于开发网页，并于2009年开发。现在它正在使用W3C推荐。
4	SVG Fonts/Shapes SVG允许SVG文档中的SVG字体。我们还可以使用font face属性将CSS应用于SVG。
5	Embedded OpenType Fonts (EOT) EOT用于开发网页，它嵌入在网页中，因此无需允许第三方字体

以下代码显示了字体面的示例代码 -

<html>
   <head>
      <style>
         @font-face {
            font-family: myFirstFont;
            src: url(/css/font/SansationLight.woff);
         }
         div {
            font-family: myFirstFont;
         }
      </Style>
   </head>
   <body>
      <div>This is the example of font face with CSS3.</div>
      <p><b>Original Text :</b>This is the example of font face with CSS3.</p>
   </body>
</html>

字体描述

以下列表包含放置在@ font-face规则中的所有字体描述 -

Sr.No.	价值和描述
1	font-family 用于定义字体名称
2	src 用于定义URL
3	font-stretch 用于查找字体应如何拉伸
4	font-style 用于定义字体样式
5	font-weight 用于定义字体粗细（粗体）