homepage-buttons.de
Homepagevorlagen, Buttons und mehr
 
 
 

2. HTML-Kurs - Texte einfügen und formatieren (1)

2.1 Schriftfarbe

In den 2 letzten Kapiteln haben Sie erfahren, wie Sie einen Text umbrechen können und wie Sie ihn links, zentriert und rechts ausrichten können. Damit haben Sie gestalterisch jedoch noch nicht wirklich viel erreicht.


Nun lernen Sie, wie Sie Text mittels HTML 4 in einer anderen Farbe darstellen können, in unterschiedlichen Größen und zu guter Letzt in unterschiedlichen Schriftarten. Abgeschlossen wird das Kapitel mit der Erklärung, wie ein Text fett, unterstrichen oder kursiv dargestellt werden kann.

Um es nochmal deutlich vorab zu sagen: die nachfolgenden Infos - insbesondere zu Font-Face und Font-Size - entsprechen nicht mehr dem aktuellen Stand der Websitegestaltung, denn heutzutage wird Formatierung und Gestaltung in CSS geschrieben! Die nachfolgenden Informationen dienen primär dem blutigen Anfänger, der sich erst einmal in die tiefsten Grundlagen des HTML 4 einarbeiten möchte oder aber diese Infos sind auch dann hilfreich, wenn man z.B. einen einzelnen kleinen Bereich eines Textes in einer vom sonstigen Design der Website entfernten Farbe definieren möchte und dafür nicht gleich die zentrale CSS-Datei projektweit anpassen möchte. Dafür nutze ich hie und da auch heute noch diese Befehle, aber nun ans Werk.

Mit dem Tag <font> wird in HTML definiert, ob Ihr Text schwarz, blau, rot, groß oder klein, als Arial, Helvetica oder Times New Roman dargestellt wird.

Beispiel:

Dies ist ein roter Text, der links ausgerichtet ist.

Dies ist ein blauer Text, der mittig zentriert ist.

Dies ist ein grauer Text, der rechts ausgerichtet ist.

 

Der zugehörige Quellcode sieht wie folgt aus:

 

<p align="left"><font color="#FF0000">Dies ist ein roter Text, der links
ausgerichtet ist.</font></p>

<p align="center"><font color="#0000FF">Dies ist ein blauer Text, der mittig
zentriert ist.</font></p>

<p align="right">Dies ist ein grauer Text, der rechts ausgerichtet ist.</p>
        

Hier werden 2 Tags miteinander verschachtelt: <p> und <font>, wobei zu beachten ist, dass die Tags in der umgekehrten Reihenfolge wieder geschlossen werden wie sie geöffnet wurden, also:
<p> <font> </font> </p>

Beim genaueren Hinsehen wird Ihnen auffallen, dass bei dem roten und blauen Text eine Farbangabe (color) im sogenannten Hexadezimalwert angegeben ist, beim grauen Text nicht. Das liegt daran, dass ich in meiner Grundeinstellung mittels CSS die Textfarbe für die Website als grau definiert habe. Dieser Text erscheint also in derselben Farbe wie dieser normale Text auch.

Sollten Sie keine Möglichkeit haben, den exakten Hexadezimalwert Ihrer gewünschten Farbe definieren zu können, so hilft Ihnen wahrscheinlich der Color Picker weiter.