Schriftformatierung 1
In diesem Kapitel lernt Ihr
Wie editiert man Zeichen?
Die folgenden Tags bewirken, dass der Text hervorgehoben wird:
<b>fett</b>
<i>kursiv</i>
Das "i" steht für das englische Wort italic (kursiv).
<u>unterstrichen</u>
Das "u" stegt für das englische Wort underline (unterstrichen).
<s>durchgestrichen</s> oder
<strike>durchgestrichen</strike>
<big>größer</big>
<small>kleiner</small>
<sup>hochgestellt</sup>
<sub>tiefgestellt</sub>
<tt>dicktengleich</tt>
Beispiel:
DieserSatzsiehtmerkwürdig aus
sieht in HTML so aus:
Dieser<b>Satz</b><i>sieht</i><small>merk</small>wür<big>dig</big>aus.
Tags können auch kombiniert werden.
Beispiel:
unterstrichen und kursiv
sieht in HTML so aus:
<u><i> unterstrichen und kursiv </i></u>
Schriftgröße, Schriftart, Farbe
Die Schriftart, -größe und -farbe werden mit dem Font-Tag bestimmt <font> </font> . Im Anfangstag wird mit der Anweisung (Attribut) size = 3 die Schriftgröße bestimmt. Mögliche Werte für die Größe sind 1 (klein) bis 7 (groß). Ihr erzeugt also Text der Größe 4 mit folgender Anweisung
<font size="4">Schrift der Größe 4 </font>. Die Standardschriftgröße ist 3. Die Schriftgröße 3 entspricht in etwa der Größe 12pt.
Beispiel:
<font size="1">Schriftgröße 1</font>
<font size="2">Schriftgröße 2</font>
<font size="3">Schriftgröße 3</font>
<font size="4">Schriftgröße 4</font>
<font size="5">Schriftgröße 5</font>
<font size="6">Schriftgröße 6</font>
<font size="7">Schriftgröße 7</font>
Neben der absoluten Größenangabe kann man die Schriftgröße relativ zur aktuellen ändern:
font size="+1", font size="-2"
Beispiel:
<font size="-2">Schriftgröße um zwei Größen verringert </font>
<font size="+1">Schriftgröße um eine Größe erhöht</font>
Als Schriftart kann man theoretisch jede Schrift hernehmen, die einem gefällt. Doch genau da kommt ein weiteres Problem auf. Denn der Betrachter muss die selbe Schrift auch auf seinem PC gespeichert haben. Ansonsten wird der Text in der Standardschrift des jeweiligen Browsers angezeigt. Gängige Schriftarten sind: Arial, Verdana, Helvetica, Times New Roman, Courier und Monospace.
Beispiel:
Ihr wollt den Text einmal in Arial und einmal in Courier darstellen:
<font face="Arial">Das ist die Schriftart Arial</font>
<font face="Courier">Das ist die Schriftart Courier</font>
Die Angabe für die Schriftart muss in Anführungszeichen stehen und der Name muss exakt so sein, wie die Schrift auf dem PC des jeweiligen besuchers lautet. Also auf Groß- und Kleinschreibung achten!
Die Schriftart kann auch mit der Schriftgröße kombiniert werden.
Beispiel:
<font face="Arial" size ="2">Arial in Schriftgröße 2</font>
Schriftfarben werden über das Attribut color="blue" gesteuert, z.B
<font color="blue">wird so blaue Schrift erzeugt</font>
Auch hier muss das Attribut in Anführungszeichen stehen!
Die 16 Grundfarben, die jeder Browser (und PC mit VGA-Garfikkarte) kann:
| black |
|
maroon |
|
| green |
|
olive |
|
| navy |
|
purple |
|
| teal |
|
gray |
|
| silver |
|
red |
|
| lime |
|
yellow |
|
| blue |
|
fuchsia |
|
| aqua |
|
white |
|
Auch diese Attribut kann man mit den Anderen kombinieren, z.B.
<font color="green" face="Arial" size="4">grüner Text in Arial mit Schriftgröße 4</font>
Wie macht man Absätze?
In HTML werden Absätze auf folgende Weise eingeleitet: <p>Text Text Text Text</p>
Ein Absatz beginnt immer mit einer neuen Zeile und endet mit einem Zeilenumbruch. Hier können die Attribute center, left, right oder justify gesetzt werden. Diese bewirken, dass der Text zentriert, linksbündig, rechtsbündig oder im Blocksatz steht.
Beispiel:
<p align="center">Dieser Text wird zentriert ausgerichtet. Dieser Text wird zentriert ausgerichtet. Dieser Text wird zentriert ausgerichtet. Dieser Text wird zentriert ausgerichtet
</p>
<p align="right">Dieser Text ist rechtsbündig. Dieser Absatz ist rechtsbündig. Dieser Text ist rechtsbündig. Dieser Absatz ist rechtsbündig. Dieser Text ist rechtsbündig. Dieser Absatz ist rechtsbündig. Dieser Text ist rechtsbündig. Dieser Absatz ist rechtsbündig.
</p>
<p align="justify">Dieser Text wird im Blocksatz formatiert. Dieser Text wird im Blocksatz formatiert, falls Ihr Browser Blocksatz kann. Falls Ihr Browser keinen Blocksatz kann ist dieser Absatz wahrscheinlich linksbündig ausgerichtet. Dieser Text wird im Blocksatz formatiert. Dieser Text wird im Blocksatz formatiert, falls Ihr Browser Blocksatz kann. Falls Ihr Browser keinen Blocksatz kann ist dieser Absatz wahrscheinlich linksbündig ausgerichtet. Dieser Text wird im Blocksatz formatiert. Dieser Text wird im Blocksatz formatiert, falls Ihr Browser Blocksatz kann. Falls Ihr Browser keinen Blocksatz kann ist dieser Absatz wahrscheinlich linksbündig ausgerichtet. Dieser Text wird im Blocksatz formatiert. Dieser Text wird im Blocksatz formatiert, falls Ihr Browser Blocksatz kann. Falls Ihr Browser keinen Blocksatz kann ist dieser Absatz wahrscheinlich linksbündig ausgerichtet. Dieser Text wird im Blocksatz formatiert. Dieser Text wird im Blocksatz formatiert, falls Ihr Browser Blocksatz kann. Falls Ihr Browser keinen Blocksatz kann ist dieser Absatz wahrscheinlich linksbündig ausgerichtet.
</p>
Wie verhindert man Zeilenumbrüche oder erzwingt sie?
Ich schätz mal, Ihr wollt manchmal Zeilenumbrüche unterdrücken, da es ziemlich blöd ausschauen würde, wenn zum Beispiel 12 Euro getrennt werden würden. Daher kann man die beiden Wörter fest miteinander verbinden, so dass sie am Ende der zeile nicht getrennt werden. Dazu setzt man den Code dazwischen. Aber fügt keine leerzeichen mehr ein! In HTML sieht´s so aus:
12 Euro
Das Zeichen beginnt mit einem & und endet mit einem ;
Wollt Ihr jedoch einen ganzen Teil des Textes vor dem Umbrauch schützen, so müsst ihr dies mit dem Tag <nobr> und <nobr> erledigen, z.B.
<nobr>Firma KeineAhnungWas GmbH<nobr>
Wollt Ihr jedoch einen Zeilenumbruch erzwingen, so benutzt Ihr das Tag <br>, z.B.
Dies ist die erste Zeile<br>nach dem Zeilenumbruch folgt die zweite Zeile.
Das Ganze sieht dann so aus:
Dies ist die erste Zeile
nach dem Zeilenumbruch folgt die zweite Zeile.
Das <br>-Tag ist eines der wenigen, dass kein Endtag benötigt.
© by Benjamin Hofmann