Beispiel HTML

 

Wissen ist Macht

Nichtwissen ist Ohnmacht

Homepage selber machen

Translate

Schnell, einfach und kostengünstig

Ein Leitfaden und Entscheidungshilfe (Stand Jun 2017)

 

Hier siehst du als Beispiel das Grundgerüst einer Homepage, eingeteilt in eine Tabelle mit drei Spalten, wobei die mittlere zur Anzeige der Daten dient und nochmals mittels Tabelle in einen Kopf- und einen Datenbereich unterteilt wurde. Diesen könnte man dann nochmals unterteilen, so daß ein Bereich für das Menue und ein zweiter für die Daten entsteht. (P.S. In der Praxis wird das aber kaum jemand machen, sondern hier werden die meisten mit Boxen arbeiten)

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<!-- Kopfbereich zur Allgemeinen Beschreibung und für Definitionen -->

<head>

<meta http-equiv="content-type"

content="text/html; charset=ISO-8859-1">

<meta http-equiv="content-language" content="de">

<meta name="description" content="Beschreibung der Homepage">

<meta name="author" content="Mein Name">

<meta name="keywords"

content="HTML, HTML-Datei, Beipspiel, Meta-Tags, Textzeilen, Tabelle">

<title>HTML Beispiel mit Grundelementen</title>

<link rel="stylesheet" type="text/css"

href="style.css">

<!-- Beginn der eigentlichen Beschreibung des Inhaltes -->

</head>

<body>

<!-- ---------------- äußere Tabelle mit drei Spalten, teilt Ansicht in Randbereich und Mittelteil zur Anzeige ----->

<table style="text-align: left; width: 100%; height: 100%;"

border="1" cellpadding="2" cellspacing="2">

<!-- Angabe border=... (Tabellenlinien) hier nur zur besseren Ansicht -->

<tbody>

<!-- erste und einzige Zeile der Tabelle -->

<tr>

<!---------------- linke Spalte (<tr> d. äußeren Tabelle als Randbereich ----->

<td style="width: 10%;"></td>

<!---------------- Mittlere Spalte d äußeren Tabelle als Anzeigebereich ----->

<td style="width: 80%;" align="undefined" valign="undefined">

<!---------------- innere Tabelle teilt Anzeigebereich in 2 Zeilen, eine für Kopfbereich und zweite zur Anzeige ----->

<table style="text-align: left; width: 100%; height: 100%;"

border="0" cellpadding="2" cellspacing="2">

<tbody>

<tr>

<!--- Kopfbereich -->

<td style="text-align: left; width: 100%; height: 20%;"

align="undefined" height="" valign="undefined">

<!--- H1 - definiert Darstellung als Überschrift -->

<h1>Das ist der Kopfbereich</h1>

</td>

</tr>

<tr>

<!--- Anzeigebereich -->

<td style="width: 100%; height: 100%;" align="undefined" valign="undefined">Bereich zur Anzeige deiner Inhalte</td>

</tr>

</tbody>

<!-- --Ende innere Tabelle -->

</table>

<!-- Ende mittlere Spalte d. äußeren Tabelle -->

</td>

<!---------------- rechte Spalte (<td> d. äußeren Tabelle als Randbereich ----->

<td style="width: 10%;" align="undefined"

valign="undefined"></td>

<!-- es folgen Ende-Tags der Zeile, tabellenkörber, Tabelle, Beschreibungsteil der HTML-Datei und der HTML-Datei selbst -->

</tr>

</tbody>

</table>

</body>

</html>