@font-face
機能を使用する必要があり、フォントはTrueType(TTF)形式なので、TTFをOpenType(OTF)形式に変換する方法。
あなたはcssで直接TTFファイル形式を使うことができます:
@font-face {
font-family: Vinegar;
src: url(http://www.4bit.co.uk/testing/design01/vinegar.ttf);
}
h3 {
font-family: Vinegar, "Times New Roman", Times, serif;
}
動作しています!
Linuxを使用している場合は、Pythonからスクリプト化できるFontForgeを使用できます。
#!/usr/bin/python
import fontforge
font = fontforge.open("STIXGeneral.otf")
font.generate("STIXGeneral.ttf")
これは、ディレクトリ全体に対して一度にこれを行う、より長いpythonスクリプトです。
それを正しく行う方法を見つけるのは痛々しいほど困難でした。これが私がOSXで動作させる方法です
$ brew install fontforge
$ fontforge -c 'Open("my.ttf"); Generate("my.otf")'
存在しないpip install fontforge
を必死に探していたのですが、python ---enable-pyextension
などでコンパイルする必要があると思います。 。
Googleでttf otf converter
をすばやく検索すると、次のような多くの結果が得られました。
https://onlinefontconverter.com
http://www.freefontconverter.com
それらがどれほどうまく機能するかはわかりませんが、試すことができます。
クロスブラウザ/モバイルサポートには、少なくとも3つの形式が必要です。
Embedded OpenType:Internet Explorer6-8の場合はeot
。
コマンドラインコンバーターがあります: http://code.google.com/p/ttf2eot/
Web Open Font Format:woff
Webフォントに関するW3C勧告: http://www.w3.org/TR/WOFF/
コンバーターはここで好きです: http://people.mozilla.org/~jkew/woff/
およびTrueType:SafariおよびOperaの場合はttf
(Scalable Vector Graphicsを追加できます:古いiOSサポートの場合はsvg
…)
防弾@ font-face構文は次のとおりです。
@font-face {
font-family: 'Vinegar';
src: url('vinegar.eot?') format('embedded-opentype'),
url('vinegar.woff') format('woff'),
url('vinegar.ttf') format('truetype'),
url('vinegar.svg#svgVinegar') format('svg');
}
その他のリソース:
http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/
http://www.fontspring.com/blog/the-new-bulletproof-font-face-syntax
http://webfonts.info/
このツールもチェックしてみてください。
https://github.com/zoltan-dulac/css3FontConverter
これを試すこともできます:
他の人が言及しているように、fontforgeスクリプトはpythonに切り替わりました。最も簡単な方法は、コマンドラインからpythonを呼び出すことです。
複数のttfフォントをotfに変換できます:
[user@Host]$ cd /path/to/your/fonts/folder
[user@Host]$ python
>>> import fontforge
>>> import os
>>> fonts = [file for files in os.listdir('.') if file.endswith('.ttf')]
>>> for font in fonts:
... f = fontforge.open(font)
... f.generate(font[:-3] + 'otf') # changes extension from ttf to otf
...
>>> exit()