在我的网站中使用泰卢固语 ttf
Using Telugu ttf in my web site
我需要能够在我的网站上使用特定的泰卢固语字体。我有 ttf 文件并生成了所需的 .eot、.woff、.woff2 和 .svg 文件。我按照下面网站上的说明创建了如下所示的样式表
@font-face {
font-family: 'sree_krushnadevarayaregular';
src: url('Sree Krushnadevaraya-webfont.eot');
src: url('Sree Krushnadevaraya-webfont.eot?#iefix') format('embedded-opentype'),
url('Sree Krushnadevaraya-webfont.woff2') format('woff2'),
url('Sree Krushnadevaraya-webfont.woff') format('woff'),
url('Sree Krushnadevaraya-webfont.ttf') format('truetype'),
url('Sree Krushnadevaraya-webfont.svg#sree_krushnadevarayaregular') format('svg');
font-weight: normal;
font-style: normal;
}
.badifont {
position: relative;
top: 1px;
display: inline-block;
font-family: 'sree_krushnadevarayaregular';
font-style: normal;
font-weight: normal;
line-height: 1;
}
https://css-tricks.com/snippets/css/using-font-face/
但是,当我使用我创建的新 class 时,文本没有以我期望的字体显示。它使用我机器上可用的默认泰卢固语字体。
我错过了什么?
3 件事要检查:在所有字体文件中,删除 space,或者用下划线代替 space,例如:
Sree_Krushnadevaraya-webfont.eot
然后在您的代码中为@fontface 调整这些文件名。
然后在文本编辑器中打开您的 svg 文件。检查字体 ID 上的内容——通常在第 6 行附近,<font id=...>
确保您在井号标签 (#) 之后使用的是准确的字体 ID 名称:
url('Sree Krushnadevaraya-webfont.svg#sree_krushnadevarayaregular') format('svg');
然后确保您的所有字体和 css 再次上传。
我再查了一下,找到了这个解决方案。
转到 Google Fonts 并输入您的字体名称。 Google 已经处理了我需要的大多数字体。然后,您可以复制 google 提供的标记并将其放入您的代码中。
所以我不得不这样做
<link href='http://fonts.googleapis.com/css?family=Tenali+Ramakrishna|Sree+Krushnadevaraya&subset=telugu&effect=outline|3d-float' rel='stylesheet' type='text/css'>
然后我使用字体系列中的字体名称设置我的样式表 'Sree Krushnadevaraya' 并且它起作用了。
我需要能够在我的网站上使用特定的泰卢固语字体。我有 ttf 文件并生成了所需的 .eot、.woff、.woff2 和 .svg 文件。我按照下面网站上的说明创建了如下所示的样式表
@font-face {
font-family: 'sree_krushnadevarayaregular';
src: url('Sree Krushnadevaraya-webfont.eot');
src: url('Sree Krushnadevaraya-webfont.eot?#iefix') format('embedded-opentype'),
url('Sree Krushnadevaraya-webfont.woff2') format('woff2'),
url('Sree Krushnadevaraya-webfont.woff') format('woff'),
url('Sree Krushnadevaraya-webfont.ttf') format('truetype'),
url('Sree Krushnadevaraya-webfont.svg#sree_krushnadevarayaregular') format('svg');
font-weight: normal;
font-style: normal;
}
.badifont {
position: relative;
top: 1px;
display: inline-block;
font-family: 'sree_krushnadevarayaregular';
font-style: normal;
font-weight: normal;
line-height: 1;
}
https://css-tricks.com/snippets/css/using-font-face/
但是,当我使用我创建的新 class 时,文本没有以我期望的字体显示。它使用我机器上可用的默认泰卢固语字体。
我错过了什么?
3 件事要检查:在所有字体文件中,删除 space,或者用下划线代替 space,例如:
Sree_Krushnadevaraya-webfont.eot
然后在您的代码中为@fontface 调整这些文件名。
然后在文本编辑器中打开您的 svg 文件。检查字体 ID 上的内容——通常在第 6 行附近,<font id=...>
确保您在井号标签 (#) 之后使用的是准确的字体 ID 名称:
url('Sree Krushnadevaraya-webfont.svg#sree_krushnadevarayaregular') format('svg');
然后确保您的所有字体和 css 再次上传。
我再查了一下,找到了这个解决方案。
转到 Google Fonts 并输入您的字体名称。 Google 已经处理了我需要的大多数字体。然后,您可以复制 google 提供的标记并将其放入您的代码中。
所以我不得不这样做
<link href='http://fonts.googleapis.com/css?family=Tenali+Ramakrishna|Sree+Krushnadevaraya&subset=telugu&effect=outline|3d-float' rel='stylesheet' type='text/css'>
然后我使用字体系列中的字体名称设置我的样式表 'Sree Krushnadevaraya' 并且它起作用了。