当先锋百科网

首页 1 2 3 4 5 6 7

CSS3 Web字体 - 编程基础教程

@font-face CSS3 at-rule允许我们指定在线字体来显示网页上的文本。

@font-face消除了对访问者计算机上安装的字体的依赖。

例子

此示例简单地指定要使用的可下载字体，将其应用于文档的整个主体。

<html>
<head>
  <title>Web Font Sample</title>
  <style type="text/css" media="screen, print">
    @font-face {font-family: "Bitstream Vera Serif Bold";
      src: url("https://mdn.mozillademos.org/files/2468/VeraSeBd.ttf");
    }
    
    body {font-family: "Bitstream Vera Serif Bold", serif }
  </style>
</head>
<body>
  This is Bitstream Vera Serif Bold.
</body>
</html>

上面的代码呈现如下：

下载字体

注意

Web字体受到相同的域限制。

字体文件必须与使用它们的页面在同一个域上，除非使用HTTP访问控制来放宽此限制。