Schrift einbetten @font-face

**katy4778** · 24.05.2011, 12:52

Hallo,

ich habe ein Problem eine Schrift einzubetten, die Websafe ist.
Ich habe eine externe .css Datei die genau so aussieht:

a:link {text-decoration: none; color: #000000; }
a:visited {text-decoration: none;color: #000000; }
a:hover {text-decoration: none; color: #000000; }
a:active {text-decoration: none;color: #000000; }

@font-face {
font-family: 'AvantGarde LT Book';
src: local('AvantGarde LT Book');
src: url(ITC_Avant_Garde_Gothic_LT_Book.ttf) format('TrueType');
src: url(._AvantGarBoo") format('AFM');
}

body {
font-family: AvantGarde LT Book, 'Trebuchet MS', Verdana, Arial, sans-serif;
font-size: 16px;
color: #000000;
}

In den .html dateien habe ich sie so rein geschrieben:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Mein_Web</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel="stylesheet" type="text/css" href="formate.css">

</head>

Ich weiss, es ist sinnvoller eine Websafe Schrift zuverwenden, aber ich möchte unbedingt die Avant Garde. Das ganze muss auch Mac tauglich sein, deshalb habe ich .ttf und und dieses AFM ;-)
Bei anderen Windows Rechnern wird die Trebuchet MS angezeigt, beim Mac die Times....
Wo liegt der Fehler...Wer kann mir helfen...Bin Verzweifelt ;-)

Jetzt schon mal vielen Dank ;-)

lg
Katja

**zehsn** · 24.05.2011, 16:55

Versuch mal ob es geht wenn du Schrift in Anführungszeichen setzt:

Code:

font-family: 'AvantGarde LT Book',Arial,sans-serif;

Falls das nicht geht, überprüf mal ob er die Schriftdateien richtig einbindet.
Und font face brauchst du keine AFM. Weder Windows noch Mac.

Code:

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot?') format('eot'),
         url('myfont-webfont.woff') format('woff'),
         url('myfont-webfont.ttf')  format('truetype'),
         url('myfont-webfont.svg#svgFontName') format('svg');
    }

Oder der ganz einfache Weg:
http://www.fontsquirrel.com/fontface/generator

**katy4778** · 24.05.2011, 17:11

erst mal vielen dank...die hochkomma hab ich total übersehen;-)
brauch ich nicht wegen mac auch einen schriftformat, dass mac unterstützt?

mein nächstes problem:
ich weiss nicht ob die richtig eingebunden sind :-( die schriftdateie .ttf liegt auf der selben ebene wie die .css datei und alle .html dateien....

**zehsn** · 24.05.2011, 17:21

Wenn du den code oben nimmst kann dir nichts passieren.

Code:

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot?') format('eot'),
         url('myfont-webfont.woff') format('woff'),
         url('myfont-webfont.ttf')  format('truetype'),
         url('myfont-webfont.svg#svgFontName') format('svg');
    }

Du brauchst jedoch mindestens ttf und eot. Nutze einfach den Generator. Das erleichtert dir einiges

**katy4778** · 24.05.2011, 17:29

ok...den code hab ich schon übernommen und halt den schriftdateinamen mit der meiner datei ersetzt.
durch den generator muss ich mich dann durchkämpfen...mit meinem englisch ist es leider nicht so weit her :-(

danke nochmal

**zehsn** · 24.05.2011, 17:44

Du brauchst die einzelnen Dateien und die erstellt der Generator dir. Du lädst deine Font da hoch und dann das erstellte kit runter.
Das musste ein Archiv sein. Das ganze entpackst du und darin enthalten sind die verschiedenen schriftdateien.
Die bindest du dann mit dem CSS font face Schnipsel ein

**katy4778** · 24.05.2011, 17:47

ok...und nochmal für die ganz dummen ;-)
ich brauch die .ttf und das format, dass mac unterstüzt, lade die beiden formate dort hoch und lade dann das runter, was ich dann im .css einbinden kann, nachdem ich es entpackt habe???

**zehsn** · 24.05.2011, 17:53

Nein du lädst eine Schrift hoch. Es reicht eine Datei (der Generator unterstütz mehrere Formate). Der Generator erstellt dir ein Archiv mit allen Dateien die Du brauchst.

**katy4778** · 24.05.2011, 19:04

supi danke ;-)

zur Startseite vom TP

Thema: Schrift einbetten @font-face

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

Schrift einbetten @font-face

Aktive Benutzer

Aktive Benutzer

Ähnliche Themen

[CSS] @font-face - eigene schriftarten einbinden

pdf, schrift einbetten

FACE TO FACE - Aber wie??

schrift einbetten

Distiller kann Font nicht einbetten

Aktive Benutzer

Aktive Benutzer

Berechtigungen