Homepage selbermachen 7.849 Themen, 35.585 Beiträge

@Amenophis IV -- HTML 7

neanderix / 15 Antworten / Flachansicht Nickles

Hallo Pharao ;-)

es hat etwas laenger gedauert, aber es ist so weit --
hier ist die naechste Lektion:

Darstellung von Text im Dokument

Das auffaelligste an (fast) jedem Dokument ist -- klar, die Überschrift.
Fuer die, die es nicht wissen: das ist das, womit die B..D-zeitung die neugieren Menschenmassen anlockt *gg*

Damit du genau das (aber bitte nicht in dem Stiel) auch auf deiner WEbsite kannst, wurden in HTML als einfache und einheitliche Strukturierungsmoeglichkeit 6 Überschriftenebenen definiert.
Diese sind in aufsteigender Reihenfolge durchnumeriert, d.h. 1 ist die Ueberschrift der hoechsten, 6 der niedrigsten Ebene.

Fuer Überschriften wird - im Gegensatz zu normalem Text - automatisch ein neuer Absatz gebildet; damit sind keine eigenen Absatzschaltungen mit (p) (/p) notwendig (dazu spaeter mehr).

Überschriften stehen zwischen den Tags (Hx) und (/Hx) (ich habs gross geschrieben wg. des kleinen x), wobei x wie oben erwaehnt, eine Ziffer zwischen 1 und 6 ist.

Mit dem nachfogenden Code bekommst du ein Beispiel zu jeder Ebene:

(html)
(head)
(title)Überschriften-Demo(/title)
(meta name="Author" content="deinname")
(/head)
(body)
(h1)Überschrift Eins(/h1)
(h2)Überschrift Zwei(/h2)
(h3)Überschrift Drei(/h3)
(h4)Überschrift Vier(/h4)
(h5)Überschrift Fünf(/h5)
(h6)Überschrift Sechs(/h6)
(/body)
(/html)

In diesem Beispiel werden die Überschriften linksbündig ausgerichtet.
Das kann man allerdings auch aendern; dafuer gibt es den "align" Parameter.

Mit (Hx align="center")....(/Hx) richtest du zentriert, mit
(Hx align="right")...(/Hx) rechtsbuendig aus - vorsicht, manche Browser verstehen das nicht!

Du kannst die Wirkung ausprobieren, in dem du den "ALIGN" Parameter in obigem Beispiel mal einfach einfuegst.

Zeilenumbrüche und Absaetze

Wie oben erwaehnt, reicht es in HTML nicht, einfach die Zeilenschaltung zu betaetigen, um beim Schreiben eines Dokumentes einen neuen Absatz zu beginnen. Veilmehr muss ein Absatzwechsel aber auch ein Zeilenwechsel durch die entsprechenden Tags erzwungen werden.

Das Tag (p) (von engl."Paragraph"=Absatz) erzeugt einen Absatz. Eigentlich kann dieses Tag alleine stehen, da kaum ein Browser auf den Abschluss durch (/p) besteht.
Sicherer ist das trotzdem, denn erstens gibt es durchaus Browser, die darauf bestehen (auch wenn ich keinen kenne ;-) ) und zweitens, so hab ich zumindest geruechte Weise gehoert, soll die Erfordernis des expliziten Abschlusses durch (/p) bald in den Standard mit aufgenommen werden.

Also - der Code

Zeile eins
Zeile zwei
Zeile drei

wuerde - ohne (p) Tag als:

Zeile eins zeile zwei Zeile drei

dargestellt, d.h. die von dir im Quellcode ausgefuehrte Zeilenschaltung wird vom Browser durch ein Leerzeichen ersetzt. Fuegst du dagegen ein Absatz-Tag ein, dann stehen die Zeilen im Ergebnis untereinander, selbst dann, wenn der Quellcode in einer zeile steht:

Zeile eins(p)Zeile zwei(/p)

wird zu:

Zeile eins

Zeile zwei

Auch dem (p)-Tag kannst du den Parameter ALIGN hinzufuegen.

Nach dem Ende eines mit dem (p) Tag definierten Absatzes folgt immer auch eine Leerzeile. Das fuehrt dazu, das der Text manchmal mehr auseinandergezogen wird, als eigentlich erwuenscht. Was bei Textverarbeitungen der "weiche Zeilenumbruch", also eine zeilenschaltung innerhalb eines Absatzes ist (WORD: Shift-Enter), kann in HTML durch das Tag (br) (engl.: break) eingefuegt werden. Zum (br) Tag gibt es uebrigens kein End-Tag, d.h. (/br) gibt es nicht.

Zeile eins(br)Zeile zwei(p)Zeile drei(/p)

wird zu

Zeile eins
Zeile zwei

Zeile drei

Normlerweise wird eine Zeile vom Browser automatisch umbrochen, sobald sie an den Rand des Browserfensters stoesst - dies passiert z.B. dann, wenn eine Site auf Browser-Vollbildmosdus ausgelegt ist, der Anwender den Browser aber im Fenster betreibt.
Soll dieser Umbruch nun aus irgendeinem Grund verhindert werden -- bitte sehr:

mit dem Tag (nobr)(/nobr) von engl. "no break" wird verhindert, das der Text, der zwischen diesen beiden Tags steht, umbrochen wird. Allerdings muss der Anwender dann mittels des horizontalen Scrollbalkens scrollen, um den Text in seiner vollen laenge zu lesen.
Daher gilt: bitte nur im Notfall einsetzen!

Genau das Gegenteil, naemlich einen Umbruch mitten im Wort, wird mit dem Tag (wbr) von engl.: "Word Break" erreicht, zu dem es keinen End-Tag gibt. Das Tag entspricht dem bedingten Trennzeichen, das von Textverarbeitungen her bekannt sein sollte.
Allerdings: der Browser stellt hier keinen Trennstrich dar. Umgekehrt reicht ein Bindestrich nicht, um den Umbruch zu erzeugen; auch in diesem Fall muss mit dem Tag nachgeholfen werden.
Da man nie wissen kann, wie breit das Fenster des Anwenders gerade ist, sollten lange Worte unbedingt mit dieser "Sollbruchstelle" versehen werden.
------------

Uebungsfragen:

1. Koennen in Ueberschriftenzeilen zwei Ueberschriftenstile gleichzeitig verwendet werden?
Wenn ja, warum, wenn nein, warum nicht?

2. Ist der (/p)-Tag unbedingt erforderlich?

-------

So, das waers fuer heute -- wenn\'s klappt, folgt morgen mehr.

Volker

Computers are like airconditioners - they stop working properly when you open Windows Ich bin unschuldig, ich habe sie nicht gewählt!
bei Antwort benachrichtigen
(Anonym) neanderix „@Amenophis IV -- HTML 7“
Optionen

wie wäre es wenn man die bisherigen Lektionen mal als zusammenstellt und als zip zum Download anbietet? Ich würd mich freuen :)

bei Antwort benachrichtigen
Ja - und? Volker neanderix