Schlagwort-Archive: CSS

Using @font-face

@font-face {
  font-family: 'MyWebFont';
  src: url('myfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('myfont.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

Eine sehr einfache Art und Weise, Schriften in eine Website einzubinden, die nicht auf dem Client installiert sind. Zur beispielhaften Verwendung der Schrift MyWebFont muss im CSS folgendes definiert werden:

body {
  font-family: 'MyWebFont', Fallback, sans-serif;
}

Obiger Code stammt von css-tricks.com.

Wichtig scheint mir zu erwähnen, dass die erstbeste passende Schrift vom Browser eingebunden wird.  Ein FF 32 wird also immer die WOFF verwenden und keine später aufgeführte Quelle. Dies ist abweichend von sonstigen CSS-Angaben, bei denen vorhergehende Definitionen ja immer überschrieben werden.