CSS3 - 字体属性(Font)

CSS3 - 字体属性(Font) 首页 / CSS入门教程 / CSS3 - 字体属性(Font)

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

Sr.No.Font & Remark
1

TrueType Fonts(TTF)

TrueType是Apple和Microsoft在1980年代后期开发的轮廓字体标准,它成为Windows和MAC操作系统最常用的字体。

2

OpenType Fonts(OTF)

OpenType是Microsoft开发的可缩放计算机字体的格式

3

Web Open  Font Format(WOFF)

WOFF用于开发网页并于2009年开发。现在W3C推荐使用它。

4

SVG Fonts/Shapes

SVG允许SVG文档中的SVG字体,还可以将CSS应用于具有字体属性的SVG。

5

Embedded OpenType Fonts(EOT)

EOT用于开发网页,并且已嵌入网页中,因此无需使用第三方字体

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

链接:https://www.learnfk.comhttps://www.learnfk.com/css/css3-web-font.html

来源:LearnFk无涯教程网

<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.Value & Remark
1

font-family

用于定义字体名称

2

src

用于定义URL

3

font-stretch

用于查找应如何拉伸字体

4

font-style

无涯教程网

用于定义字体样式

5

font-weight

用于定义字体粗细(粗体)

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

人工智能基础课 -〔王天一〕

许式伟的架构课 -〔许式伟〕

张汉东的Rust实战课 -〔张汉东〕

A/B测试从0到1 -〔张博伟〕

性能优化高手课 -〔尉刚强〕

如何读懂一首诗 -〔王天博〕

深入C语言和程序运行原理 -〔于航〕

React Native 新架构实战课 -〔蒋宏伟〕

高并发系统实战课 -〔徐长龙〕

好记忆不如烂笔头。留下您的足迹吧 :)