16

考虑许可证：

http://font.ubuntu.com/ufl/FAQ.html

如何在不要求用户安装的情况下在任何网站上使用Ubuntu字体系列？
可以通过以下工具使用它： http //code.google.com/intl/zh-CN/apis/webfonts/

websites license ubuntu-font-family

— Takehin
source

25

您可以通过2种方法在您的网站中嵌入Ubuntu字体-使用Google字体目录（首选）或使用@font-faceCSS声明并手动转换字体。

使用Google Webfonts

您现在可以将Ubuntu字体用作Google网络字体。这将使过程变得更加简单。这部分答案的大部分内容来自sladen的答案。

为什么首选使用Google Font API？

使用Google Font API是一个很好的建议，因为它允许webfonts在所有现代浏览器上自动运行，而不必担心细节。使用字体API意味着访问者将始终会自动看到字体的最新版本。

如何使用Google Font API？

自2010年12月21日起，Ubuntu字体家族现已包括在内并可通过Google Font API进行部署，请访问：

font.ubuntu.com/web

您可以阅读有关该新闻的Google Web字体发布，然后：

打开Google字体目录：“ Ubuntu-使用此字体 ”页面
选中网页所需的常规，斜体，粗体和粗斜体的权重和样式的组合。
如果默认值不正确，请选择所需的语言/脚本组合：带有英语示例的俄语网站可能使用“西里尔字母，拉丁字母”。
在HTML页面或模板<link>之间添加给定标签，<head> ... </head>并在之间的<style> ... </style>标签之间添加适当的CSS代码<head>。

例如，如果您正在创建俄语/英语混合网站，并希望将字体用作所有文本的默认字体，则可以在<head>标签之间添加以下代码：
```
<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' />
<style type="text/css" >
    body {
        font-family : 'Ubuntu', sans-serif;
    }
</style>
```

注意事项：

“拉丁”是使用英语以及许多其他欧洲和非洲语言编写的脚本。

“子设置”通过仅发送某些语言的字符来优化字体文件，每种字体大约为44 kB。目前显示的168 kB数字是作为单个Web字体下载的所有1,200+个字形的，而单个网站则不需要大多数。

Ubuntu字体文件会自动以正确的格式转换为不同的浏览器；根据品牌和版本要求的格式是WOFF，EOT，SVG或TTF。CSS的正确组合特定于每个页面请求，并神奇地解决了这一难题。

使用@ font-face

您可以通过将 Ubuntu字体转换为WOFF字体来嵌入它们。然后，您可以使用CSS @ font-face声明将其嵌入。字体（.ttf文件）可以在中找到/usr/share/fonts/truetype/ubuntu-font-family。

例如，要使用转换为WOFF文件Ubuntu-R.woff的Ubuntu Regular字体，请使用以下CSS代码：

@font-face
{
    font-family : "Ubuntu-R";
    src: url('Ubuntu-R.woff');
}

对于Ubuntu Bold同样：

 @font-face
{
    font-family : "Ubuntu";
    src: url('Ubuntu-B.woff');
    font-weight : bold;
}

Ubuntu斜体：

@font-face 
{
    font-family : "Ubuntu";
    src: url('Ubuntu-I.woff');
    font-style : italic;
}

Ubuntu Bold Italic：

@font-face
{
    font-family : "Ubuntu";
    src: url('Ubuntu-BI.woff');
    font-weight : bold;
    font-style : italic;
}

所有最新的浏览器都支持此功能。

注意事项

请记住，某些用户将其浏览器设置为使用一组特定的字体，如果使用自定义字体，可能会感到烦恼。另外，请阅读Ubuntu字体许可以获取有关如何分配字体的确切条款。

— dv3500ea
source

@ DKuntz2-确实更好；我现在改变了答案。

— dv3500ea 2011年

不明白需要复制斯拉登的答案。为什么不编辑呢？

— papukaija 2011年

我很早就回答了这个问题，概述了@ font-face方法。这是在将字体添加到Google Font API之前（这是一种更好的方法）。我在回答的开头只添加了一条简短的注释，而斯拉登的回答则更为全面，使用google方法的回答也更好。

— dv3500ea 2011年

1

但是，这时我的回答被接受并被高度评价，结果是人们可能认为他们应该使用@ font-face方法，这种方法不太可取。sladen就此事通过电子邮件与我联系，我同意更改答案，并根据本网站的创用CC许可进行归属。

— dv3500ea 2011年

10

使用Google Font API是一个很好的建议，因为它允许webfonts在所有现代浏览器上自动运行，而不必担心细节。使用字体API意味着访问者将始终会自动看到字体的最新版本。

自2010年12月21日起，Ubuntu字体家族现已包括在内并可通过Google Font API进行部署，请访问：

font.ubuntu.com/web

您可以阅读有关该新闻的Google Web字体发布，然后：

打开Google字体目录：“ Ubuntu-使用此字体 ”页面
选中网页所需的常规，斜体，粗体和粗斜体的权重和样式的组合。
如果默认值不正确，请选择所需的语言/脚本组合：带有英语示例的俄语网站可能使用“西里尔字母，拉丁字母”。
将这两行CSS复制并粘贴到HTML页面或模板的<head> ... </head>和<style>...</style>部分中。

笔记：

“拉丁”是英语以及许多其他欧洲和非洲语言编写脚本。

“子集”通过仅发送某些语言的字符来优化字体文件，每个字体约为44 kB。当前显示的168 kB数字是作为单个Web字体下载的所有1,200+个字形的，而单个网站则不需要大多数。

Ubuntu字体文件会自动以正确的格式转换为不同的浏览器；根据品牌和版本要求的格式是WOFF，EOT，SVG或TTF。CSS的正确组合特定于每个页面请求，并神奇地解决了这一难题。

— 被杀
source

8

很长时间以来，服务器端字体渲染（也许是更好的“动态字体渲染”）一直是一个有趣的问题。

从技术上讲，为了使机器显示特定字体，应该已经在本地安装它似乎是合乎逻辑的。

另一方面，由于必须坚持使用基本的/众所周知的“网络字体”，网页设计会损失很多。

CSS2.1通过使用@ font-face规则声明进行了一些改进。
它尚未成为标准，但最终将在CSS3中使用。

除此之外，还有一些替代方法，例如：

我希望所提供的链接能使您更好地了解可以做什么；-)

— 帕夫洛斯·G。
source

在任何网页上嵌入Ubuntu字体

使用Google Webfonts

使用@ font-face

注意事项