SUCHE MIT Google
Web virtualuniversity.ch
HOME DIDAKTIK ECDL ELEKTRONIK GUIDES HR MANAGEMENT MATHEMATIK SOFTWARE TELEKOM
DIENSTE
Anmeldung
Newsletter abonnieren
Sag's einem Freund!
VirtualUniversity als Startseite
Zu den Favoriten hinzufügen
Feedback Formular
e-Learning für Lehrer
Spenden
Autoren login
KURSE SUCHEN
Kurse veröffentlichen

Suche nach Datum:

Suche mit Schlüsselwort:

Suche nach Land:

Suche nach Kategorie:
PARTNER
ausbildung24.ch - Ausbildungsportal, Seminare, Kursen... 

 
HTMLopen.de - Alles was ein Webmaster braucht

 
PCopen.de - PC LAN Netze und Netzwerke - alles was ein IT Profi und Systemtechnicker braucht

GUIDES UND TUTORIAL

Verschiedene Strukturelemente

Überschriften

Es existieren sechs verschiedene Stufen von Überschriften, die entsprechenden Tags lauten
<H1> <H2> <H3> <H4> <H5> <H6>
<H1> ist die oberste Stufe, mit ihr sollte der Beginn einesDokumentes überschrieben werden.

Kommentare

Kommentare werden vom Browser ignoriert und nicht angezeigt. Sie sind eingeschlossen von <!-- und --> und dürfen nicht verschachtelt werden.

Zeilenumbruch

Leerzeichen und -zeilen in HTML-Dokumenten werden vom Browser in der Regel ignoriert, da Informationen über Zeilenwechsel und Beginn eines neuen Abschnittes in den einzelnen Strukturanweisungen enthalten sind. Sollte es einmal nötig sein, einen Zeilenumbruch zu erzwingen, so geschieht dies mit Hilfe der <BR>-Anweisung.

Absatz

Der Beginn eines neuen Absatzes wird durch <P> markiert, er führt beim Browser dazu, einen vertikalen Abstand einzufügen und den Text zu Beginn einer neuen Zeile fortzuführen. Der Absatzende-Tag </P> hat bei nachfolgenden P-Tag keine Wirkung.

Waagrechte Trennlinie

der Tag<HR> zeichnet eine waagrechte Trennlinie. Mit den Optionen WIDTH und SIZE können Länge und Dicke eingestellt werden. Die Linie wird zentriert, falls sie kürzer als die Seite ist. Die Breite kann sowohl in Pixeln, als auch in % der Seitenbreite angegeben werden. EIn paar Beispiele:

<HR width=50%>


<HR width=100 size=5>

Mit den bisher behandelten Tags lassen sich bereits einfache Dokumente gestalten. Der folgende Text zeigt ein Musterdokument mit HTML-Auszeichnungen:

                                        <HTML>
                                        <HEAD><TITLE>Die erste Seite</TITLE></HEAD>
                                        <BODY>
                                        <H1>Überschrift Ebene 1</H1>
                                        <H2 align=right>Überschrift Ebene 2, align=right</H2>
                                        <H3 align=left>Überschrift Ebene 3, align=left</H3>
                                        <H4 align=center>Überschrift Ebene 4, align=center</H4>
                                        <H5>Überschrift Ebene 5</H5>
                                        <H6>Überschrift Ebene 6</H6>
                                        <P>
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        Hier kommt dann ein ganz normaler Fliesstext.....
                                        <P>
                                        Will man einen Zeilenumbruch, muß man das angeben:<BR>
                                        Hier kommt dann ein ganz normaler Fliesstext.....<BR>
                                        Hier kommt dann ein ganz normaler Fliesstext.....<BR>
                                        Hier kommt dann ein ganz normaler Fliesstext.....<BR>
                                        Hier kommt dann ein ganz normaler Fliesstext.....<BR>
                                        Hier kommt dann ein ganz normaler Fliesstext.....<BR>
                                        </BODY>
                                        </HTML>
                                        

Vom Browser dargestellt sieht er dann so aus (wobei der Titel nicht sichtbar ist):


Überschrift Ebene 1

Überschrift Ebene 2, align=right

Überschrift Ebene 3, align=left

Überschrift Ebene 4, align=center

Überschrift Ebene 5
Überschrift Ebene 6

Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext..... Hier kommt dann ein ganz normaler Fliesstext.....

Will man einen Zeilenumbruch, muß man das angeben:
Hier kommt dann ein ganz normaler Fliesstext.....
Hier kommt dann ein ganz normaler Fliesstext.....
Hier kommt dann ein ganz normaler Fliesstext.....
Hier kommt dann ein ganz normaler Fliesstext.....
Hier kommt dann ein ganz normaler Fliesstext.....


Vorformatierter Text

Vorformatierter Text kann in <PRE> und </PRE> eingeschlossen werden. Text innerhalb dieser Tags wird in der Regel in einem nichtproportionalen Zeichensatz dargestellt, wobei alle Leerzeichen und -zeilen sowie Zeilenumbrüche direkt übernommen werden. Sämtliche HTML-Tags behalten jedoch ihre Gültigkeit und werden auch innerhalb des <PRE>-Blocks dargestellt.

Einrückungen, längere Zitate

Einrückungen und längere Zitate werden am besten in einem eigenen Abschnitt dargestellt. Dies erreicht man durch <BLOCKQUOTE> und </BLOCKQUOTE>. Text innerhalb dieser Tags wird normalerweise vom Browser eingerückt oder in Schrägschrift und als separater Absatz mit etwas Abstand zum normalen Text angezeigt.

Verschiedene Schriftarten

Unter HTML gibt es zwei verschiedene Typen von Schriftarten, physikalische und logische. Erstere geben direkt die Art der Schrift an (fett, schräg, usw.) während letztere sagen, um welche Art Text es sich handelt und dem Browser die Entscheidung über die tatsächliche Darstellung überlassen. Alle Schriftartenbefehle benötigen ein Start- und ein Ende-Tag. Folgende physikalische Schriftarten existieren:
<TT>
Nichtproportionaler Typewriter-Zeichensatz
<B>
Fettschrift
<I>
Italic oder Schrägschrift
<U>
unterstrichen (Achtung! Manche Browser stellen Links unterstrichen dar!)
<S>
durchgestrichen
Folgende logische Schriftarten stehen zur Verfügung:
<EM>
Hervorgehoben, wird dargestellt durch Schrägschrift.
<STRONG>
Stärkere Hervorhebung, wird dargestellt durch Fettschrift.
<CODE>
Wird verwendet für Befehle und Quellcode, dargestellt durch nichtproportionalen Zeichensatz.
<SAMP>
Eine Folge von Buchstaben.
<KBD>
Wird bei Anleitungen zur Darstellung des vom Benutzer einzugebenden Textes verwendet.
<VAR>
Für die Darstellung von Variablennamen.
<DFN>
Für die Definition von Ausdrücken, wird dargestellt durch Fett- oder Schrägschrift.
<CITE>
Wird verwendet für Zitate, dargestellt durch Schrägschrift.
Neuere Browser beherrschen auch die folgenden Tags:
<SUB>
Teile der Schrifttiefergestellt.
<SUP>
Höhergestellte Teile der Schrift.
<BIG>
Ein Wort größer.
<SMALL>
Ein Wort kleiner.

Listen

Zur Zeit stehen folgende Listen-Typen zur Verfügung:
Einfache Listen (Unnumbered Lists):
Diese werden eingeleitet durch <UL>. Sie zählen die einzelnen Elemente ohne laufende Numerierung auf, stattdessen wird ein neutrales Aufzählungszeichen vorangestellt. Welches Zeichen dazu verwendet wird ist Browser-abhängig, möglich sind z.B. Punkte, Striche oder Sternchen. Jedes Listenelement wird eingeleitet durch <LI>. Zum Beispiel:

  • Erstes Element
  • Zweites Element
  • Drittes Element

Als Parameter bei <UL> und bei <LI> können Sie mit TYPE=xxx den Typ des Aufzählungssymbol angeben. Weiter unten sehen Sie die drei Möglichkeiten: TYPE=DISK für den schwarzen Punkt, TYPE=CIRCLE für den Kreis und TYPE=SQUARE für das Quadrat.

Aufzählende Listen (Ordered Lists):
Sie sind den einfachen Listen sehr ähnlich, nur werden bei ihnen die Listenelemente fortlaufend durchnumeriert. Das zugehörige Listen-Tag lautet <OL>. Zum Beispiel:

  1. Erstes Element
  2. Zweites Element
  3. Drittes Element
Auch bei der "Ordered List" haben Sie die Möglichkeit, mit TYPE=xxx das Aufzählungssymbol festzulegen (bei <OL> und bei <LI>). und zwar:
    TYPE=1     für Ziffern
    TYPE=A     für Großbuchstaben
    TYPE=a     für Kleinbuchstaben
    TYPE=i     für kleine römische Ziffern
    TYPE=I     für große römische Ziffern
Außerdem kann man mit dem Parameter START=nnn den Startwert der Aufzählung und mit VALUE=nnn bei jedem einzelnen <LI> den Wert des Aufzählungspunktes festlegen. nnn ist dabei immer numerisch anzugeben, die Umwandlung in Buchstaben oder römische Ziffern erfolgt automatisch.

Beschreibende Listen (Descriptive Lists):
Elemente einer beschreibenden Liste bestehen aus dem Titel der zu beschreibenden Sache, welche in irgendeiner Form besonders hervorgehoben wird, sowie dem Beschreibungstext. Eine beschreibende Liste wird eingeleitet durch <DL>, der Titel durch <DT> und der Beschreibungstext selbst durch <DD>. EinBeispiel bildet diese Aufzählung.

Es existieren noch weitere Listentypen, die jedoch von den Browsern recht stiefmütterlich behandelt werden. <MENU> ist eine in der Darstellung etwas kompaktere Form von <UL>, <DIR> ist für eine Liste von kürzeren Elementen gedacht, die auch in mehreren Spalten auf dem Bildschirm dargestellt werden können.

Listen können beliebig verschachtelt werden, man sollte sich jedoch nicht darauf verlassen, daß der Browser die einzelnen Verschachtelungsebenen hinreichend eindeutig darstellen kann (z. B. durch Wechsel des Aufzählungszeichens):

  • Erstes Element
    • Erstes Unterelement
    • Zweites Unterelement
    • Drittes Unterelement
    • Viertes Unterelement
  • Zweites Element
    • Erstes Unterelement
      • Erstes Unter-Unterelement
      • Zweites Unter-Unterelement
      • Drittes Unter-Unterelement
    • Zweites Unterelement
      • Erstes Unter-Unterelement
      • Zweites Unter-Unterelement
      • Drittes Unter-Unterelement
  • Drittes Element

Links zu anderen Dokumenten

Ein Link wird eingeleitet durch <A (A steht für "Anchor"), gefolgt von einem oder mehreren der folgenden Parameter:
  • HREF Gibt einen URL auf ein Zieldokument an, auf das beim Anwählen des Links gesprungen werden soll. Nur durch Angabe des HREF-Parameters wird ein Link aktiv und selektierbar.
  • NAME Wird verwendet, um innerhalb eines Dokumentes eine Markierung anzugeben, welche im HREF-Parameter angegeben werden kann. Somit können einzelne Stellen in einem Dokument (z. B. Unterkapitel) direkt angesprungen werden.
  • REL Ermöglicht es, eine "Beziehung" zu dem Zieldokument zu definieren.
  • REV Gibt ebenfalls eine Beziehung zwischen Dokumenten an, jedoch in der entgegengesetzten Richtung, d. h. ein Link von A nach B mit REL="X" ist das gleiche wie ein Link von B nach A mit REV="X".
  • URN Gibt eine eindeutige Kennummer für das Dokument an, um dem Browser die Möglichkeit zu geben, das doppelte Laden von Dokumenten zu erkennen und zu verhindern. Dies ist noch in der Entwicklung.
  • TITLE Gibt den Titel des Zieldokumentes an, damit der Browser diesen darstellen kann. Dieser Titel sollte identisch sein mit dem durch <TITLE> definierten im Kopf des Zieldokumentes.
Parameter, die Leer- oder Sonderzeichen enthalten, müssen in doppelte Anführungszeichen (") eingeschlossen werden. Es macht nichts aus, wenn man grundsätzlich die Optionswerte in " einschließt. Alle diese Parameter sind optional, jedoch macht ein Link ohne HREF- oder NAME-Parameter nicht viel Sinn.

Danach wird das Tag mit > beendet, gefolgt vom Text oder der Grafik, welche den Link repräsentieren sollen. Abgeschlossen wird der Link durch </A>.

Hier einige Beispiele:

  1. Ein typisches Link zu einer anderen WWW-Seite:
                                            Willkommen bei der <A HREF="http://info.cern.ch/hypertext/WWW/MarkUp/MarkUp.html">
                                            Mutter aller WWW-Seiten</A>.
                                            

    Durch den Browser formatiert könnte das etwa so aussehen:


    Bei Links innerhalb des Angebots eines Servers sollte man die vollständige URL mit Angabe des Rechnernamens (z. B. http://www.online-de.de) vermeiden, denn bei solchen Angaben erfolgt jedesman eine Anfrage zum Nameserver. Ein lokales Link sollte also z. B. "tips/index.html" lauten. Zu beachten ist auch, daß der Schrägstrich Verzeichnistrenner ist, nicht der Backslash(\), der bei DOS und Windows verwendet wird. Bei den lokalen Links gibt es auch noch einen Unterschied: Ein Link kann vom Stammverzeichnis des Serverangebots ausgehen. In diesem Fall beginnt die Angabe des Dateipfades mit einem Schrägstrich (/). Man nennt dies einen absoluten Pfad. Man kann aber auch vom aktuellen Verzeichnis ausgehen, z. B. "news/index.html". Es wird dann in das Verzeichnis "news" gewechselt und die Datei "index.html" an den Browser geschickt. Will man dann wieder ins übergeordnete Verzeichnis aufsteigen, kann die Verzeichnisangabe ".." verwendet werden (wie bei DOS und Windows), z. B. "index.html". Da sich solche Links auf das aktuelle Arbeitsverzeichnis beziehen, nennt man sie relative Links. Die relativen Links haben den Vorteil, daß man komplette Verzeichnisstrukturen innerhalb der Dateistruktur des Servers "umziehen" kann, ohne daß eine einzige WWW-Seite geändert werden muß.

    Natürlich können Sie nicht nur HTM-Dokumente verlinken, sondern jede beliebige Datei. Bei Links auf Bilder (z. B. A HREF="image.gif">Ein Bild ) wird einfach die Bilddatei angezeigt. Man kann damm mit dem "Back"-Button des Browsers zur ursprünglichen Siete zurückkehren. Handelt es sich um Links auf andere Dateien, beispielsweise PDF-Dateien, gepackte Archive (.zip), Programme (.exe), Word-Dokumente (.doc) oder Excel-Tabellen (.xls), dann hängt es von den Einstellungen des Browsers und von den zur Verfügung stehenden Plug-Ins ab, was geschieht. Bei sicherer Browsereinstellung fragt der Browser nach, ob das Dokument geöffnet oder auf Platte gespeichert werden soll, im anderen Fall wird nur nachgefragt, wenn der Dateityp dem Browser nicht bekannt ist, und ansonsten die Datei mit dem passenden Programm (MS Word, Acrobat Reader, usw.) automatisch geöffnet. Damit haben Sie auch die Möglichkeit, Dateiarchive per WWW-Interface anzubieten.

DIPLOMARBEITEN UND BÜCHER

Diplomarbeiten zum Runterladen:

Suche im Katalog:
Architektur / Raumplanung
Betriebswirtschaft - Funktional
Erziehungswissenschaften
Geowissenschaften
Geschichtswissenschaften
Informatik
Kulturwissenschaften
Medien- und Kommunikationswissenschaften
Medizin
Psychologie
Physik
Rechtswissenschaft
Soziale Arbeit
Sozialwissenschaften


JOBS
HOME | E-LEARNING | SITEMAP | LOGIN AUTOREN | SUPPORT | FAQ | KONTAKT | IMPRESSUM
Virtual University in: Italiano - Français - English - Español
VirtualUniversity, WEB-SET Interactive GmbH, www.web-set.com, 6301 Zug

Partner:   Seminare7.de - PCopen.de - HTMLopen.de - WEB-SET.com - YesMMS.com - Ausbildung24.ch - Manager24.ch - Job und Karriere