eigene Schriftarten verwenden

[gabko]

ich hatte das Problem, dass ich eine eigene Schriftart ein eine Seite einbetten musste. Die Suche hier im Forum hat mir geholfen, indem ich mehrere Teile zusammengeführt habe. Ich denke, dass viele ein ähnliches Problem haben. Hier meine Lösung, die sowohl in neueren IE-Versionen, als auch FF funktioniert:

im Head:
<style type="text/css">
@font-face { font-family:schrift1; src:url(fonts/schrift1.ttf); }
</style>
<!--[if IE]>
<style type="text/css">
@font-face { font-family:schrift1; src:url(fonts/schrift1.eot); }
</style>
<![endif]-->

und dann im Body:
z.B.:
<p style="font-family:schrift1">Das ist der Mustertext</p>

Dazu muss die Schriftart sowohl als ttf als auch eot-File vorliegen, in meinem Fall habe ich eigene Unterverzeichnis für die Fonts angelegt. Programme zum konvertieren bitte googlen.
Hoffe, dass hilft jemanden.

[Gunnar Bittersmann]

@@gabko:

nuqneH

<style type="text/css">
@font-face { font-family:schrift1; src:url(fonts/schrift1.ttf); }
</style>
<!--[if IE]>
<style type="text/css">
@font-face { font-family:schrift1; src:url(fonts/schrift1.eot); }
</style>
<![endif]-->

Die Browserweiche mit conditional comment kannst du dir sparen. Die übliche Einbindung von Webfonts sieht weitere Formate vor und sieht so aus:

@font-face  
{  
	font-family: 'schrift1';  
	src: url('fonts/schrift1.eot');  
	src: local('☺'),  
		url('fonts/schrift1.eot?') format('embedded-opentype'),  
		url('fonts/schrift1.woff') format('woff'),  
		url('fonts/schrift1.ttf') format('truetype'),  
		url('fonts/schrift1.svg#schrift1') format('svg');  
}

Qapla'