Kurzeinführung HTML

Erscheinungsbild
HTML Syntax
Erweitert

Text fett

<strong>Ihr Text </strong>
 
Text kursiv
<em>Ihr Text</em>
 
Text fett und kursiv
<strong><em>Ihr Text</em></strong>
 

Text normal unterstrichen

<u>Ihr Text</u>
 
Text tiefgestellt
<sub>Ihr Text</sub>
 
Text hochgestellt
 <sup>Ihr Text</sup>
 
Text farbig

<font color="#FF0000" Textfarbig</font>

Der Wert in den Anführungszeichen gibt den HEX-Wert für die jeweilige Farbe an. Die ersten beiden Zahlen geben den Rot Anteil, die zweiten zwei Zahlen geben den grün Anteil und die letzten beiden Zahlen den blau Anteil an. Vorangestellt wird immer ein "#" Zeichen. Auf der rechten Seite finden Sie eine Farbpalette mit 16 Farben die in allen Browsern richtig angezeigt werden. Sie können auch mit anderen Farben herumexperimentieren, sollten aber beachten das nicht alle Browser alle Farben richtig anzeigen.

#000000 #808080
#800000 #FF0000
#008000 #00FF00
#808000 #FFFF00
#000080 #0000FF
#800080 #FF00FF
#008080 #00FFFF
#C0C0C0 #FFFFFF
Webschriftart

face="Schriftart"

Mögliche Schriftarten die zu allen Browsern kompatibel sind:

Times New Roman, Times, serif
Arial, Helvetica, sans-serif
Courier New, Courier, mono
Georgia, Times New Roman, Times, serif
Verdana, Arial, Helvetica, sans-serif
Geneva, Arial, Helvetica, sans-serif

Wird keine Schriftart angegeben so wird automatisch die Standardschriftart des Browsers benutzt

 

 

neuer Absatz (Enter)
<p>&nbsp;</p>
Ausrichtung von Text

Text kann links, mittig oder rechts ausgerichtet werden. Auch der sogenannte Blocksatz wird von HTML unterstützt. Hier die grundlegenden Befehle für die Ausrichtung und ein Beispiel:

align="center"
Mittig
align="left" Links

align="right"

Rechts
align="justify"
Blocksatz

 

 
Grösse von Text

<font size="Wert">

Die Werte in Anführungszeichen können auf einer Scala von "+7" - "-7" angegeben werden.

Beispiel: Das ist ein Mustertext mit Größe "4"

Syntax: <p><font size="4">Das ist ein Mustertext mit Größe "4"</font></p>

 
 

Manchmal ist es notwendig Eigenschaften von Artikeln in Tabellenform aufzulisten. Auch dazu bietet HTML die nötigen formatierungsmöglichkeiten wovon hier die grundlegenden an Beispielen erklärt werden.

 

Grundlegender Tabellenaufbau

<table>
<tr>
<td></td>
<td></td>
<td></td>
<tr>
<tr>
<td></td>
<td></td>
<td></td>
<tr>
<tr>
<td></td>
<td></td>
<td></td>
<tr>
</table>
 
leitet den Aufbau einer Tabelle ein
<table>
 
beendet die Aufgebaute Tabelle
</table>
 
definiert eine Datenzelle
<td>
 
beendet die Datenzelle
</td>
 
leitet eine neue Tabellenzeile ein
<tr>
 
beendet die Tabellenzeile
</tr>
 
Tabellenbreite in %
widt="x%"
 
Rahmen und Gitternetzlinien
Border= Wert größer 0
 
Zellauffüllung Wert größer 0
cellspacing="0"
 
Ausrichtung der Tabelle proportional zur Seite oder Begrenzung
align="center"
 
Beispiel:
Hersteller
BMW
Modell
320 I
Baujahr
2002
Preis
16000 Euro

Der Syntax

<table width="60%" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><div align="center"><font size="2" face="Arial, Helvetica, sans-serif">Hersteller</font></div></td>
<td><div align="center">BMW</div></td>
</tr>
<tr>
<td><div align="center"><font size="2" face="Arial, Helvetica, sans-serif">Modell</font></div></td>
<td><div align="center">320 I </div></td>
</tr>
<tr>
<td><div align="center"><font size="2" face="Arial, Helvetica, sans-serif">Baujahr</font></div></td>
<td><div align="center">2002</div></td>
</tr>
<tr>
<td><div align="center"><font size="2" face="Arial, Helvetica, sans-serif">Preis</font></div></td>
<td><div align="center">16000 Euro</div></td>
</tr>
</table>

 
     
 
Manchmal ist es nötig ein Bild von einen Anderen Ort zu laden, eine Webseite mit einer erweiterten Artikelbeschreibung aufzurufen. Dabei helfen Ihnen die nachfolgenden Funktionen.
 
Bild von anderen Ort laden.
<img src="file:Speicherort (z.B.<img src="file://http://www.bildseite.de/bilder/bild.jpg)" width="100" height="100"> Die Werte "width" und "height" geben dabei die auszugebende Bildgrösse an.
 
Webseite aufrufen (LINK)
<a href="www.Ihre-seite.de">hier rufen Sie meine Seite auf.</a>
 
Bild als Link
 
<a href="www.ihre-seite.de"><img src="file://http://www.ihre-seite.de/bild.jpg" width="10" height="10"</a>
 
 
email

Eine Emailadresse können sie mit folgenden Syntax in ein bestehendes Dokument einfügen:

Syntax: <a href="mailto:mail@user.de">email</a>

Beispiel: email

 
 
Wir hoffen Ihnen mit dieser kurzen Übersicht ein wenig helfen zu können, um Ihre Angebote noch repräsentativer zu gestalten. Natürlich ist dies nur eine sehr kurze Hilfe zur Syntaxsprache HTML, jedoch finden Sie im Internet bzw. im Handel genügend Literatur zu diesem Thema. Viel Spaß nun beim gestalten Ihrer Angebote.
 

Design by Rene Menzel - Clickgrafx Webdesign