首页 前端知识 无涯教程-CSS3 - 字体属性(Font)

无涯教程-CSS3 - 字体属性(Font)

2024-09-04 23:09:40 前端知识 前端哥 143 503 我要收藏

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用于开发网页,并且已嵌入网页中,因此无需使用第三方字体

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

<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

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

CSS3 - 字体属性(Font) - 无涯教程网无涯教程网提供Web字体用于允许CSS中的字体,这些字体未在本地系统上安装。 Sr.No. Font & Remar...https://www.learnfk.com/css/css3-web-font.html

转载请注明出处或者链接地址:https://www.qianduange.cn//article/17622.html
标签
评论
发布的文章

关于HTML的知识

2024-09-18 23:09:36

js简单实现轮播图效果

2024-09-18 23:09:36

CSS3美化网页元素

2024-09-18 23:09:27

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!