Question

我终于能够让我的网站显示阿拉伯字体，但它是我不想要的默认字体。

在SO社区的帮助下，我发现了Dejavu字体。我去了他们的网站并下载了一个无衬线的拉链文件夹。我假设我必须上传一些东西到我的服务器。如果是，我上传哪个文件？我在我的html文件中写什么来“引用”我的网站的字体？我打开了zip文件夹中的所有文件，其中只有一个表明我可以下载该字体。但我不需要在我的电脑上下载它。我需要将其上传到云端，以便它可以在我的网站上。

有什么想法吗？

另外，我如何在这里上传Dejavu文件夹，以便人们可以看到它并知道我在说什么？

Answer 1

@font-face和@font-face Font Squirrel Generator

Answer 2

如果您希望使用字体嵌入（和@ font-face），那么如果您希望覆盖大多数平台，则需要以不同格式显示字体。参见例如The Essential Guide to @font-face

但是有一种更简单的方法：只需在CSS中的font-family声明中声明您的首选字体（在检查它们中的每一个都包含您使用的所有字符之后）。然后并不是所有人都会看到DejaVu中的文本（只有那些与例如OpenOffice的Linux或已单独下载安装它的人一起使用的文本）。下载较大字体或几种字体的开销是不可忽略的，尤其是在使用例如移动连接缓慢。

Answer 3

扩展书架的观点：

查看Font Squirrel的@font-face kits。有几种DejaVu套件可供选择。套件包括CSS和DejaVu文件，几乎可以在网络上使用的每种可用格式。将字体文件放在您喜欢的任何文件夹中并相应地更改CSS。

例如，我将字体定义存储在/css/fonts.css中，我的字体存储在/fnt/FontName/

中

来自fonts.css

@font-face {
    font-family: 'DejaVu Sans';
    src: url('../fnt/DejaVuSans/DejaVuSans-webfont.eot');
    src: url('../fnt/DejaVuSans/DejaVuSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fnt/DejaVuSans/DejaVuSans-webfont.woff') format('woff'),
         url('../fnt/DejaVuSans/DejaVuSans-webfont.ttf') format('truetype'),
         url('../fnt/DejaVuSans/DejaVuSans-webfont.svg#DejaVuSansBook') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DejaVu Sans';
    src: url('../fnt/DejaVuSans/DejaVuSans-Oblique-webfont.eot');
    src: url('../fnt/DejaVuSans/DejaVuSans-Oblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fnt/DejaVuSans/DejaVuSans-Oblique-webfont.woff') format('woff'),
         url('../fnt/DejaVuSans/DejaVuSans-Oblique-webfont.ttf') format('truetype'),
         url('../fnt/DejaVuSans/DejaVuSans-Oblique-webfont.svg#DejaVuSansOblique') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'DejaVu Sans';
    src: url('../fnt/DejaVuSans/DejaVuSans-Bold-webfont.eot');
    src: url('../fnt/DejaVuSans/DejaVuSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fnt/DejaVuSans/DejaVuSans-Bold-webfont.woff') format('woff'),
         url('../fnt/DejaVuSans/DejaVuSans-Bold-webfont.ttf') format('truetype'),
         url('../fnt/DejaVuSans/DejaVuSans-Bold-webfont.svg#DejaVuSansBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVu Sans';
    src: url('../fnt/DejaVuSans/DejaVuSans-BoldOblique-webfont.eot');
    src: url('../fnt/DejaVuSans/DejaVuSans-BoldOblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fnt/DejaVuSans/DejaVuSans-BoldOblique-webfont.woff') format('woff'),
         url('../fnt/DejaVuSans/DejaVuSans-BoldOblique-webfont.ttf') format('truetype'),
         url('../fnt/DejaVuSans/DejaVuSans-BoldOblique-webfont.svg#DejaVuSansBoldOblique') format('svg');
    font-weight: bold;
    font-style: italic;
}

然后使用字体：

body {
    font-family: 'DejaVu Sans',sans-serif;
}

如何在阿拉伯语网站上使用Dejavu字体？

3 个答案:

来自fonts.css