[CSS] Eigene Fonts verwenden

Drucken
( 0 Votes ) 
Hauptkategorie: Programmieren Kategorie: CSS
Erstellt am 21.01.2013 Zuletzt aktualisiert am 03.05.2013 Geschrieben von Jonny132
Bislang waren Webentwickler gezwungen vom Betriebssystem vorinstallierte Fonts zu verwenden um die Reibungslose anzeige der Website zu gewährleisten.

Mit CSS3 gibt es nun die Möglichkeit einen eigenen Font auf dem Server zu speichern und diesen dem Browser zum Download anbieten und anzeigen zu lassen.
Dazu muss man zuerst eine neue @font-face - Regel erstellen. In dieser ist es möglich seinem eigenen Font einen Namen zu geben und den Pfad zum Font anzugeben.

Beispiel - Neue @font-face - Regel:
@font-face
{
  font-family: meinEigenerFont;
  src: url('font.ttf') ,url('font.eot');
}
Bei der Font-Family - Eigenschaft wird der neue Fontname angegeben welcher wir im späteren CSS-Code verwenden können.
Mittels src geben wir die Pfade zu den Fontdateien an.
Anmerkung: Der Internet Explorer unterstützt im Moment nur eot-Dateien.
  
Beispiel - Verwendung des eigenen Fonts in CSS:
body
{
  font-family:meinEigenerFont;
}
Wie ihr seht könnt ihr im weiteren CSS-Code einfach auf eure neu erstellt Font-Face - Regel verweisen und somit euer eigenes Font verwenden.

   
  

    Veröffentlichen Sie ihre Kommentare ...