Betreff Fonts für Entwickler

  • kommt drauf an, wie du ihn einbindest, wenn du einfach nur font-family: DeinFont; machst, muss er installiert sein, aber wenn du das ganze so machst, dann muss er nicht installiert sein, sondern nur du musst einen link zur font-datei setzen

    CSS
    @font-face {
        font-family: DeinFont;
        src: local(DeinFont) /* Überprüfen, ob der Font evtl. schon installiert ist */
             url("fonts/DeinFont.ttf"); /* font-datei einbinden */
    }


    das ganze kannst du dann ganz normal im restlichen CSS-Code so verwenden:

    CSS
    selector {
        font-family: DeinFont;
    }
  • Es geht sogar noch einfacher :) --> <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro' rel='stylesheet' type='text/css'>


    HTML
    <!doctype html><html><head>    <title></title>    <!--  Meta-TAGS und so'n Zeuch-->    <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro' rel='stylesheet' type='text/css'></head><body>...


    Wenn du mal hier klickst siehst du was dahintersteckt :P

  • Aber ich weiss immer gern was "es" macht, wenn ich was einfüge.
    In dem fall weiss ich gar nix und daher ... =)
    Im anderen fall weiss ich, dass es (wie es schon bei den comments steht) prüft, ob font vorhanden, andern falls "font liegt dort" ... =)


  • Aber ich weiss immer gern was "es" macht[...]


    Bei @ramon1611: seinem Code hast du nicht's gesagt.

    [...]

    CSS
    @font-face {
        font-family: DeinFont;
        src: local(DeinFont) /* Überprüfen, ob der Font evtl. schon installiert ist */
             url("fonts/DeinFont.ttf"); /* font-datei einbinden */
    }

    [...]


    Inwiefern unterscheidet es sich zu dem:

    Zitat von &quot;http://fonts.googleapis.com/css?family=Source+Code+Pro&quot;


    CSS
    @font-face{font-family:'Source Code Pro';font-style:normal;font-weight:400;src:local('Source Code Pro'),local('SourceCodePro-Regular'),url(http://themes.googleusercontent.com/static/fonts/sourcecodepro/v2/mrl8jkM18OlOQN8JLgasDxM0YzuT7MdOe03otPbuUS0.woff) format('woff');}



    abgesehen davon, dass es komprimierter ist und du nur einen einfachen Link einbinden musst, anstatt die paar Codezeilen manuell bei dir einzutragen? :P


    PS:

    Aber ich weiss immer gern was "es" macht[...]


    Ich mache hier kein "mimimimimmi er mag meinen Code nicht ;(;( " . Ich meine ja nur. :)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!