Mathias Homepagekurs 2

Wir haben jetzt also ein Grundgerüst erstellt, das wir mit Inhalten füllen wollen.

Hier die wichtigsten Befehle
(zur Erinnerung: alle Befehle kommen in den Bereich zwischen <body> und </body>) :

Reiner Text:
Text, so er keine besonderen Formatierungen enthalten soll, wird einfach geschrieben.

Zeilenumbruch:

Steht für Break, also einen Zeilenumbruch. Wenn Sie im Editor einen Text schreiben und 'Enter' drücken, springt der Cursor in die nächste Zeile. Nicht aber beim Browser!!! Der Browser schreibt so lange in die gleiche Zeile, bis entweder die Zeile aus ist, oder er ein <br> findet. Dieser Befehl muß nicht geschlossen werden, es gibt kein </br>!

Überschriften:

<h1>Überschrift</h1>
So sieht es aus:

Überschrift

Der Befehl für Überschriften. Je nach gewünschter Größe ist ein Bereich von h1 bis h6 möglich. h1 ist riesig, h6 kaum mehr zu lesen. Am besten ausprobieren! Dieser Befehl muß geschlossen werden, sonst wird die ganze Seite in der entsprechenden Größe angezeigt. Achtung: Überschriftenbefehle setzen bei Beendigung (z.B. </h1>) automatisch einen Zeilenumbruch.

Grafiken:

Dies ist der Befehl, um eine Grafik einzubinden. Zulässige Dateiformate für Internetgrafiken sind .gif und .jpg.
Zu Erklärung: img steht für image, src für source (Quelle). Nicht die Anführungszeichen vergessen!

Wenn Sie ein eigenes Bilderverzeichnis mit dem Namen 'pics' anlegen, wäre der Pfad "pics/datei.gif". Muß nicht geschlossen werden! Tip: Es ist gut, dem Browser gleich die Bildgröße mitzuteilen, da er die Seiten dann schneller aufbauen kann. Die Bildgröße erfahrt Sie in Ihrem Grafikprogramm (z.B. in Paint Shop Pro unter 'Bildinformation').Der img-Befehl wird dann also um folgende Attribute erweitert:

Hier soll das Bild "Test" mit einer Größe von 200 Pixel breite und 100 Pixel höhe gezeigt werden.

Einbildmitwidth=200height=100

Links:

Befehl: <a href="datei.htm">Klick hier drauf, um den Link zu öffnen</a>
So sieht es dann aus: Klick hier drauf, um den Link zu öffnen

Links werden in Seiten eingebunden, um Verknüpfungen zu anderen .htm oder.html Dateien herzustellen, wenn man draufklickt. Im Beispielbefehl wird eine lokale Datei eingebunden, d.h. eine Seite die auf dem gleichen Server im gleichen Verzeichnis liegt. Um eine Fremddatei/eine fremde Seite anzulinken, müssen Sie die komplette Adresse (URL) angeben. Das kann zum Beispiel so aussehen:

<a href="http://www.deineseite.de">Link zu einer Seite</a>

Wichtig ist, daß die fremde Adresse (incl. http://, usw. ) angegeben wird. Achtung: Der Befehl muß mit </a> geschlossen werden! Sonst weiß der Browser nicht, bis wohin der Link gehen soll.

Mails:

Befehl: <a href="mailto:kmf00@web.de">Schick mir eine Mail</a>
So sieht es dann aus: Schick mir eine Mail

Jeder will ein wenig Feedback erhalten. Die einfachste Möglichkeit ist, sich ein Mail schicken zu lassen. Das Prinzip ist das gleiche, wie bei einem Link. Nur, daß man statt des Dateinamens "mailto:deine@email" eingibt.

Und hier noch einmal eine Übersicht über die gebräuchlichsten Befehle:

Befehl	Bedeutung
<B> ... </B>	Stellt den Text in Fettdruck dar.
<BR>	Erzeugt einen Zeilenumbruch (vgl mit dem P-Befehl).
<CENTER> ... </CENTER>	Zentriert den Text oder das Objekt.
<H1> ... </H1> bis <H6> ... </H6>	Die Zahl 1, 2, 3, ... 6 hinter dem H gibt die Größe bzw. den Schriftgrad an. Wobei die Zahl 6 die kleinste und die Zahl 1 die größte Schriftgröße darstellt.
<SMALL> ... </SMALL>	Dieser Befehl stellt die Schrift klein dar.
<BIG> ... </BIG>	Dieser Befehl stellt die Schrift groß dar.
<font face="Schriftart">	Legt eine bestimmte Schriftart fest. Ist die Schriftart auf dem Rechner des Besuchers nicht verfügbar, so wird der Text in der jeweiligen Standard-Schriftart angezeigt.
<font color="#ffffff">	Bestimmt die Textfarbe (siehe Tabelle Schritt 1) Beispiele : black, green, red
<font size="1">	Bestimmt die Textgröße [von 1 (klein)-6 (groß)]
a) <HR> b) < HR WIDTH=75%> c) <HR WIDTH=75% ALIGN="right"> d) <HR SIZE="5">	a) Erzeugt eine horizontale Linie. b) Erzeugt eine horizontale Linie, die 75% der Bildschirmbreite lang ist. c) Rechtsbündige, horizontale Linie, die 75% der Bildschirmbreite lang ist. d) Horizontale Linie, die 5 Pixel hoch <dick> ist.
<I> ... </I>	Stellt den Text kursiv dar.
<U> ... </U>	Unterstreicht den Text.
<SUB> ... </SUB>	Die Schrift wird _{tiefgestellt.}
<SUP> ... </SUP>	Die Schrift wird ^{hochgestellt.}
<S> ... </S>	Die Schrift wird ~~durchgestrichen.~~
<P> ... </P> <P ALIGN="left"> ... </P> <P ALIGN="right"> ... </P> <P ALIGN="center"> ... </P>	Erzeugt einen Absatz (vgl. mit BR - Befehl). Der Absatz ist linksbündig. Der Absatz ist rechtsbündig. Der Absatz wird zentriert.
<UL> <LI> Beispiel 1 <LI> Beispiel 2 <LI> Beispiel 3 </UL>	Aufzählung ohne Nummerierung Beispiel 1 Beispiel 2 Beispiel 3
<OL> <LI> Beispiel 1 <LI> Beispiel 2 <LI> Beispiel 3 </OL>	Aufzählung mit Nummerierung (bei 1 beginnend) Besipiel 1 Beispiel 2 Beispiel 3
<OL> <LI> Beispiel 1 <LI> Beispiel 2 <OL> <LI> Beispiel 2.1 <LI> Beispiel 2.2 <LI> Beispiel 2.3 </OL> <LI> Beispiel 3 </OL>	Aufzählung mit Nummerierung in Verschachtelung Beispiel 1 Beispiel 2 Beispiel 2.1 Beispiel 2.2 Beispiel 2.3 Beispiel 3

Html Befehle innerhalb des <body>-tags eines HTML-Dokuments

Überschrift

Grafiken:

Links: