Die Seite trägt zu Unrecht(?) auch dieses zweite Logo: 
denn der Validator meckert "text-shadow" (aus CSS2) an. Siehe den Eintrag oben!
Die CSS2-Spezifikation unterscheidet feinsinnig zwischen Möglichkeiten der Formatierung von Text und von Fonts. Das wäre nachzuvollziehen, wenn es bei "Text" um alle Möglichkeiten der Präsentation von Text ginge, geht es aber nicht. In diesem Kapitel geht ausschließlich um lesbaren (oder vor lauter Gestaltung nicht mehr lesbaren) Text. Auch wenn die Browser noch nicht alle Formatierungsmöglichkeiten beherrschen, die Palette der sicher bedienten Möglichkeiten ist so reichhaltig, daß man auf die Formatierung mit den Mitteln von HTML getrost verzichten kann.
| CSS-Attribut | Möglichkeiten | Beispiel |
|---|---|---|
| color | Schriftfarbe, für die zulässigen Farbangaben vgl. die Farbübersicht. Die Testroutinen des CSS-Konsortiums (siehe das Seitenende) lieben es, wenn zu (Vordergrund-)Farben auch die Hintergrundfarbe angegeben wird, wie hier geschehen. Sonst hagelt es 'warnings'. | style="color:#132BFF;background-color:#F9F235;" |
| direction | Schriftverlauf, mögliche Werte sind: ltr, rtl, vererbt | chusreV nie ruN Natürlich muß der Text ebenfalls "falsch rum" eingegeben werden. Hier steht <p style="direction:rtl !important">chusreV nie ruN</p> |
| font | Ermöglicht (1) gesammelte Angaben zur Zeichenformatierung (font-style, font-variant, font-weight, font-size/line-height, font-family) es entfallen die speziellen Attributnamen; Werte einfach durch Zwischenraum getrennt aufzählen. Besonderheit: Wenn font-size/line-height festgesetzt werden, dann in der angegebnen Form mittels "/" verbunden. Oder (2) die Angabe von System-Fonts, nämlich caption, icon, menu, message-box, small-caption, status-bar, die dazu irgendwo formatiert sein müssen. | Eingetragen ist hier style="font: bold 2em/150% serif" |
| font-family | Schriftnamen wie arial, times, verdana können hier festgelegt werden. Man bedenke, eine Schrift kann auf dem Zielrechner nur dann angezeigt werden, wenn sie dort installiert ist. Deshalb können mehrere Schriftnamen, durch Komma getrennt, angegeben werden. Die erste vorhandene Schrift wird benutzt. Wenn ein Schriftenname ein Leerzeichen enthält, muß er mit Anführungsstrichen oder mittels Hochkomma geklammert werden. Daneben können Schriftgattungen (generic font families) angegeben werden. Es werden erkannt: cursive, fantasy, monospace, sans-serif, serif. Es wird empfohlen, die Liste vorgeschlagener Schriften immer mit einem generischen Fontfamilie als Default zu beenden. Man kann mit @font-face{font-family:schriftname;src:url} Schriftsätze nachladen. Zulässige Dateiformate sind .eot und .pfr | style="font-family:cursive" style="font-family:fantasy" style="font-family:monospace" style="font-family:sans-serif" style="font-family:serif" |
| font-size | Angabe in allen zugelassenen numerischen Werten z.B. 12pt, oder auch in relativen Werten. Der relative Bezug setzt voraus, daß dem body eine gewünschte Schriftgröße zugeordnet wurde, sonst macht der Browser, was er für richtig hält. Vordefinierte Schriftgrößenattribute sind xx-small, x-small, small, medium, large, x-large, xx-large sowie die relativen Angaben: smaller, larger., die sich auf geerbte Werte beziehen, was u.U. zu Unklarheiten füren kann. | Eingetragen sind: style="font-size:xx-small" ist HTML-Größe 1 x-small, small, ist HTML-Größe 2 medium, ist HTML-Größe 3 large, ist HTML-Größe 4 x-large, ist HTML-Größe 5 xx-large. ist HTML-Größe 6 die relativen Attribute smaller und larger. |
| font-style | Schriftstil wie italic, normal, oblique, inherit. oblique bedeutet auf Deutsch z.B. "unaufrichtig". Das soll Schriften betreffen, die im User-Recher generiert oder verändert worden sind. Ganz aufrichtig: Null Peilung, wie das gehen soll! | style="font-style:italic" style="font-style:normal" style="font-style:oblique" style="font-style:inherit" |
| font-variant | Darstellungsarten, bisher realisiert: normal, small-caps, inherit. | style="font-variant:normal" style="font-variant:small-caps" style="font-variant:inherit" |
| font-weight | Schriftstärke, mögliche relative Angaben sind lighter (= dünner), normal, bold, bolder( = extra-fett). Daneben gibt es die Möglichkeit, über einen Zahlenschlüssel, der von extra-dünn (100) bis extra-fett (900) alle vollen Hunderter erlaubt, absolute Stärken festzulegen. Ob der Browser mitmacht, wenn er mitmacht, hängt davon ab, ob der betreffende Schriftsatz in der gewünschten Stärke vorhanden ist. | style="font-weight:lighter", normal, bold, bolder, 100 = lighter, 200, 300, 400 = normal, 500, 600, 700 = bold, 800, 900 = bolder. inherit. |
| letter-spacing | Buchstabenabstände, angegeben wird der gewünschte Zuwachs zum Normalabstand. Zulässig alle numerischen, auch negative Werte oder normal. Anwendbar für alle Tags (in denen Text vorkommt). | Hier sind 5px Abstand eingestellt. diese Zeile ist mit "normal" wieder zurückgestellt. |
| line-height | Zeilenabstand, mögliche Werte sind: normal, Zahlwert, inherit. Bei zu geringer Wahl überdecken sich Schriftzeilen | hier ist style="line-height:8px" eingestellt und die Folge ist nicht ganz vorhersehbar. Es gelingt nicht, den Zeilenvorschub ganz zu unterbinden. |
| text-align | Horizontale Ausrichtung mit den zulässigen Werten: center, justify (Blocksatz), left, right. Anwendbar auf Blockelemente wie <p> oder <p>. Geht deshalb mit <div> aber nicht mit <span>! | Aufrufmuster: <div style="text-align:center">Der Text</div> Beispiel: style="text-align:center" style= "text-align: justify" - so lautet der Eintrag, der, wenn nur der Text wortreich genug ist, dazu führt, daß dieser wortreiche Text im Blocksatz erscheint ... style="text-align:left" style="text-align:right" |
| text-decoration | Text-Verschönerung(?) mit den möglichen Angaben underline, overline, line-through, blink, none (nicht jeder Browser tut alles!) | style="text-decoration:blink" style="text-decoration:line-through" style="text-decoration:none" style="text-decoration:overline" style="text-decoration:underline" |
| text-indent | Einrückung der ersten Zeile eines Absatzes, angebbar in Längenwerten oder einem Prozentsatz der Breite des Blockelements, in dem die Einrückung erfolgt. Sie gehört zu Blockelementen wie <p>, <div>, <td> etc. Funktioniert interessanterweise auch für den obersten Block <body> und wirkt sich dann evtl. seitenweit auf alle Zeilenanfänge aus. | <td style="text-indent:0.5cm"><br /> so lautet hier der Eintrag, den wir ... </td> |
| text-shadow | Schatten zur Schrift. Lange von keinem Browser bedient. Aber Hurra: Der Konqueror aus KDE (Linux!), Safari3 und iCab tun es. Nun ja, es gibt Schlimmeres. CSS 2.0 verlangt zwei bzw. drei Längenangaben, zwei für die waagerechte und senkrechte Verschiebung, die nach unten rechts positiv zählen, die dritte reguliert die Verschmierung ("blur-radius"), die Farbe ist die des Schattens. Solche Angaben können sich, durch Komma getrennt wiederholen. Das gibt dann mehrere Schatten. text-shadow muß man aber zeitweilig vergessen, denn es ist in CSS 2.1 abgeschafft und für wieder CSS3 angekündigt. Der CSS-Validator will es im Moment nicht kennen! | Schatten! Papagei! Glimmfunktion. <span style="font-size: 3em;background: #eee;color: #D2FD13;text-shadow: 0px 0px 5px #0E26FF;">Glimmfunktion.</span> oder auch Outline? |
| text-transform | Textumwandlung, capitalize (= Wort beginnt mit Großbuchstaben), uppercase, lowercase, none, ihnerit ( = nix ändern) | style="text-transform:capitalize" - Im Code mit Großbuchstaben geschrieben!STYLE="TEXT-TRANSFORM:LOWERCASE" StYlE="TeXt-TrAnSfOrM:nOnE" style="text-transform:uppercase" - Im Code, wie es sein muß, mit Kleinbuchstaben geschrieben! und schließlich style="text-transform:inherit" |
| unicode-bidi | Schriftverläufe bei sowohl rechts- wie linksläufigen Schriften innerhalb eines Dokuments. Mögliche Werte sind: normal, embed, bidi-override, inherit | Kommt bei HTML-Heimwerkern wohl eher selten vor |
| vertical-align | Vertikale Ausrichtung der Inhalte von Tabellenzellen. Mögliche Werte sind: baseline, bottom, middle, sub (tiefer), super (höher), text-top, text-bottom, top, inherit. Diese Ausrichtung funktioniert nur für die ganze Zelle. | style="vertical-align:bottom", wenn es zuviel Text wird, wird der Textbeginn soweit nach oben geschoben, wie erforderlich. |
| white-space | Regelt Behandlung von Leerzeichen. Es gibt die Werte: pre, normal, nowrap, pre-wrap, pre-line. Damit werden die Möglichkeiten der nicht mehr gebräuchlichen HTML-Tags <PRE> und <NOBR> nachgebildet. Anwendbar auf Blockelemente. Die ersten drei Eigenschaftswerte sind selbsterklärend. pre-wrap und pre-line bedeuten eigentlich dasselbe wie pre, erhalten bzw. beseitigen aber mehrere aufeinanderfolgende Leerzeichen. | style="white-space:nowrap", so lautet hier der Eintrag, den wir ... |
| word-spacing | Wortabstände. Voraussetzung ist das Vorhandensein von Leerzeichen, deren Länge manipuliert werden kann. Zulässig alle numerischen, auch negative Werte oder normal. | Hier sind 25pt Abstand eingestellt. Hier dagegen -3px! |
In der rechten Spalte stehen die Aufrufe. Wenn der Code zum Aufruf nicht angegegeben ist, ist er mit dem <span>-Tag erfolgt.
Die Seite trägt zu Unrecht(?) auch dieses zweite Logo:
denn der Validator meckert "text-shadow" (aus CSS2) an. Siehe den Eintrag oben!