HTML
| Kategorie: | Informatik |
|---|---|
| Eingesendet: | 23.12.2005 |
| Wörter: | 16350 |
| Autor: | Despair |
| Dokument melden: |
HTML
Kurzübersicht HTML-Befehle
( kürzer geht’s kaum )Grundstruktur einer HTML-Datei
Der Grundaufbau lautet:
< HTML >
< HEAD >
< TITLE >
< /TITLE >
Inhalt
Einblendung in der Titelzeile desBrowserfensters< /HEAD >
< BODY >
< /BODY >
< /HTML >
Es gibt öffnende und schließende Befehle öffnender Befehle < Befehl >
schließender Befehle < /Befehl >
Textformatierung
Jeder Zeilenumbruch und jeder Absatz muss per Befehl zugewiesen werden.
Zeilenumbruch <BR> (Ausnahme kein schließender Tag)
Absatzanfang <P>
Absatzende </P>
Überschrift <H1> Überschrift </H1>
<H6>
Ausrichtung zentriert <CENTER> Text </CENTER>
Schriftgröße <FONT SIZE = Zahl> Text </FONT SIZE>
Sonderzeichen
Auch wenn deutschsprachig eingestellte Browser die Umlaute ä, ö, ü, Ä, Ö, Ü und ß exakt verarbeiten, können anderssprachig eingestellte Browser dies nicht. Im Sinne eine korrekten Darstellung der Webseite unter allen Varianten muss man diese Zeichen per Befehl erzeugen.
Benötigt man mehr als ein Leerzeichen, muss man auch diese als Sonderzeichen verwenden.
Sonderzeichenbefehle beginnen mit & und enden mit ;
&
auml; ä Ä Ä ß ß&
ouml; ö Ö Ö Leerzeichen&
uuml; ü Ü ÜFarbgebung
kann durch Farbbenennung yellow , red, lightblue
oder RGB-Code erfolgen.
R Rotanteil, G Grünanteil, B Blauanteil Wertangabe dabei im Hexadezimal-code 0,..9,A,..F
ganzes Dokument betreffend Vereinbarung im <BODY ...>
Hintergrundfarbe
< BODY BGCOLOR=" RED">
< BODY BGCOLOR=" BLUE">
Schrift
betreffend <FONT COLOR= ...> Text </FONT COLOR> < FONT COLOR="GREEN"> grüne Farbe </FONT COLOR>< FONT COLOR= #12AA12> Farbe </FONT COLOR>
Hat man mehrere Textattribute verwendet <FONT COLOR="RED" SIZE=12> kann man alle Einstellungen mit einem Befehl beenden. </FONT>
Bilder/Hintergrundbilder
verwendbare Dateiformate gif und jpg
Hintergrundbild
<BODY BACKGROUND="BACK.JPG">Bildformatierung wird beeinflusst durch die Auflösung im Bildschirmbereich.
Bildaufruf
< IMG SRC="GLDNGATE.JPG ">Größe der Anzeige festlegen < IMG SRC="GLDNGATE.JPG " HEIGHT = 30% >
Ausrichtung < IMG SRC="GLDNGATE.JPG " ALIGN ="RIGTH" >
Links
Für die links ist die Beachtung der Pfadangabe und der Schreibweise von Dateinamen absolut wichtig.
Groß- Kleinschreibweise
Der slash
/ (Umschalttaste+7) muss als Trennung der Ordner verwendet werden.
Link auf eine andere Datei
<A HREF = "
Text der in der Anzeige erscheint </A>Auch ein Bild kann man mit einem link belegen.
<A HREF = "
<img src="Bilddatei"> </A>
Link auf eine bestimmte Stelle innerhalb einer Datei
zuerst Anker setzen an der gewünschten Stelle :
<A NAME="
Zielstelle </A>Aufruf mit :
<A HREF = "#Text der in der Anzeige erscheint </A>
Link an eine bestimmte stelle in einer anderen Datei
zuerst Anker setzen an der gewünschten Stelle in der entsprechenden Datei :
<A NAME="
Zielstelle </A>Aufruf mit :
<A HREF = "
Text der in der Anzeige erscheint </A>
Tabellen
Grundstruktur
<TABLE>
<TR>
<TD>
</TD>
<TD>
</TD>
Zeile Spalte (Zelle) Spalte (Zelle)</TR>
<TR>
<TD>
</TD>
<TD>
</TD>
Die Formatierung des Inhalt muss in den Zellen erfolgen.
Die Formatierung einzelner Tabellenbestandteile in den jeweiligen Strukturbefehlen.
<TABLE BORDER="Zahl">
<TABLE BGCOLOR="Farbe">
<TABLE WIDTH="100%">
<TABLE CELLSPACING = "Zahl">
<TD FONT COLOR ="GREEN">
<TD WIDTH ="30%">
<TD VALIGN="TOP">
Möchte man die oberste Zeile der Tabelle als Tabellenkopf gestalten, verwendet man statt des Befehls <TD> </TD> den Befehl <TH> </TH>. Damit wird der Inhalt als Tabellenkopf formatiert, ohne weitere notwendige Befehle erscheint der Text zentriert und fett.
Besondere Gestaltung
Eine Zelle über 5 Spalten <TD COLSPAN=5"> Zelle1 </TD> | ||||
Zelle2 | Zelle3 | Zelle4 | Zelle5 | Zelle6 |
Zelle8 | Zelle9 | Zelle10 | Zelle11 | |
Zelle12 | Zelle14 | |||
Zelle15 | Zelle16 | |||
Zelle17 | Zelle18 | Zelle19 | Zelle20 | Zelle21 |
Beispiel
<TABLE>
<TR>
<TD COLSPAN=5>
Zelle1 </TD> !! Keine weiteren <TD> </TD>Die erste Zelle legt alle 5 Zellen fest.
</TR>
<TR>
<TD>
<TD>
<TD>
<TD>
<TD>
</TR>
<TR>
<TD ROWSPAN=3>
<TD>
<TD>
<TD>
<TD>
</TR>
<TR>
Zelle2 </TD>Zelle3 </TD>Zelle4 </TD>Zelle5 </TD>Zelle6 </TD>Zelle7 </TD>Zelle8 </TD>Zelle9 </TD>Zelle10 </TD>Zelle11</TD>!! Erste Zelle fällt weg, steht ja schon eine Zeile darüber.
<TD>
<TD ROWSPAN=2 COLSPAN=2>>
Zelle12 </TD>Zelle13 </TD> !! Belegt auch die nächste Zelle.<TD>
</TR>
<TR>
Zelle14 </TD>!! Erste Zelle fällt weg, stet ja schon eine Zeile darüber.
<TD>
Zelle15 </TD> !!!! Diese 2 Zellen fallen ebenfalls weg, stehen ja schon eine Zeile darüber.
<TD>
</TR>
<TR>
<TD>
<TD>
<TD>
<TD>
<TD>
</TR>
</TABLE>
Ich hoffe ich konnte euch etwas helfen.^^
Zelle16 </TD>Zelle17 </TD>Zelle18 </TD>Zelle19 </TD>Zelle20 </TD>Zelle21 </TD> für diese Tabellenform: Zellen über mehrere Spalten oder Zeilen oder Beides. Ausrichtung des Textes beginnend an der Oberkante der Zelle Breite der Spalte in Bezug auf die TabellenbreiteSchriftfarbe in dieser ZelleBreite der Zwischenräume zwischen den Zellen Breite der Tabelle in Bezug auf die FensterbreiteHintergrundfarbe der Tabelle Einstellung der Randbreite der Tabelle Spalte (Zelle) Spalte (Zelle)</TR>
</TABLE>
ZeileDateiname#Zielstelle"> Zielstelle"> Zielstelle"> Zielstelle"> Dateiname"> Dateiname">< IMG SRC="GLDNGATE.JPG " WIDTH = 50% >
Nicht Alles ist als Hintergrundbild geeignet, ist die Bildgröße kleiner als die Bildschirmdarstellung wird die Einblendung des Hintergrundbildes wiederholt.
oder <BODY BGCOLOR=#0000FF>(entspricht blau) oder <BODY BGCOLOR=#FF0000>
(entspricht rot) Überschrift </H6> 1 am Größten, 6 am Kleinsten Informationen für den Browser oder Suchmaschinen
Diskussion
Dein Kommentar
Was hältst du von dem Dokument HTML? Sag uns eines Meinung!
Ich bin beim Stöbern auf diese Liste gestoßen,und was für ein Zufall, dass
ist morgen unser Thema
im EDV-Kurs. Bin total begeistert, da habe ich einen super Anhaltspunkt.Danke
ist gut, aber das mit der Tabelle is unübersichtlich
Echt nicht schlecht was du da gezaubert hast,
Aber diese Mega tabellen erklärung hättest du dir praktisch sparen können, wenn
du noch en frame erklärung reingebracht hättest (fenster im fenster)
noaja, am Ende is es auch ziemlich verwurschtelt was da steht...
Aber immer noch:
ist nichtmehr ganz auf dem aktuellen stand gibt da schon änderungen und nicht
alles is richtig....
soll kein schlechtes kommi sein nurn hinweis
respekt ;)
echt klasse ich mach das nämlich grad in informatik und bin erst garnich zu
rande gekomm aba jetz hab ich es kapiert....danke...echt goil
also ich bin auch auf nem gymi und ich hab informatik(bei uns gibt es auch ne
robotik-ag^^)
Supii...ich wollte schon immer mal verstehn, wie das alles funktioniert. mich
interessiert das herbe, aber ich hab davon eg. keine ahnung. xP naja
vielleicht/hoffentlich hilft mir deine erklärung da :] danke nochmal. Ich bin ja
leider auf Gymi und da hat man kein Informatik...xPP egal
LG
Echt supi!
jetzt hab ich das endlich kapiert
Danke
Ich danke dir für die Html-befähle!
wie soll des bitte gehn?