====== Schriftformatierungen ====== Mit CSS ist es ohne Probleme möglich, jede Art von Schrift- und Absatzformatierung umzusetzen. Die Eigenschaften können grundsätzlich auf alle Elemente angewendet werden, die Text beinhalten, also auch auf Listen, Formulare, Tabellen, ... ===== Schriftart ===== Die Schriftart wird mit der Eigenschaft **font-family:** festgelegt, diese nimmt als Wert sowohl eindeutige Schriftarten (z.B. verdana) als auch Schriftfamilien (z.B. serif) an. Eine Schriftfamilie beinhaltet mehrere Schriftarten, von der der Browser die 1. beim Benutzer verfügbare auswählt. Man kann (und i.d.R. tut man das auch) auch mehrere Schriftarten bzw. -familien angeben. Der Browser nimmt dann standardmäßig die 1., wenn die Schriftart nicht installiert ist die 2., usw. **Beispiel:** font-family: Verdana, Arial, sans-serif; Generische Schriftarten

sans-serif

serif

cursive

fantasy

monospace

 ==== Eigene Schriftart mitliefern ==== Zuerst definitert man mit font-face eine eigene Schriftart, die man aus der Schriftdatei lädt. Diese Schriftart kann man dann anwenden. @font-face { font-family: Raleway; /* Dieser Name ist beliebig */ src: url(Raleway-Thin.ttf); }

Raleway

/* hier muss der Wert von font-family bei der font-face-Deklarierung verwenet werden! */ ===== Schriftfarbe ===== Die Schriftfarbe eines Elements wird (wie die Farbe aller Elemente) mit der CSS-Eigenschaften **color:** festgelegt. Mögliche Werte sind wie bei HTML HEX-Codes (mit führender #) oder Farbnamen (green, darkgreen, ...) ===== Schriftgröße ===== Die Schriftgröße eines Elements wird mit der CSS-Eigenschaften **font-size:** festgelegt. Diese Eigenschaft nimmt als Wert (wie alle Größen-/Längeneinheiten in CSS) verschiedene Einheiten an, z.B. px, em, cm, % -> [[inf:inf7b_201011:css:einheiten|mehr Informationen zu diesen Einheiten.]] ===== Weitere CSS-Eigenschaften ===== ^ Eigenschaft ^ wichtige Werte ^ Erklärung ^ | font-style | italic, normal | Bestimmt die Darstellung der Schrift, im wesentlich kursiv oder normal | | font-weight | bold, normal | Legt die "Schriftgewichtung" fest | | text-align | left, right, center, justify | Ausrichtung des Textes | | text-decoration | underline, overline, line-through, blink, none | Ermöglicht Unter/Durch/Überstreichungen und blinkenden Text | | text-shadow | Farbe, 3x Länge | Informationen s. [[http://www.css4you.de/Texteigenschaften/text-shadow.html|hier]] | | word-spacing | Längenangabe | Abstand zwischen den Wörtnern | | letter-spacing | Längenangabe | Abstand zwischen den Buchstaben/Zeichen | ===== Weitere Informationen auf CSS4You ===== Weitere Informationen zu diesen und weiteren CSS-Eigenschaften und den anwendbaren Werten gibt es unter [[http://www.css4you.de/Schrifteigenschaften/fontproperty.html|http://www.css4you.de/Schrifteigenschaften/fontproperty.html]] (Schrifteigenschaften) und unter [[http://www.css4you.de/Texteigenschaften/textproperty.html]] (Texteigenschaften).