Die folgende Übersicht dient zur Hilfestellung und listet grundlegende Elemente auf, die ihr braucht, um euer Projekt zu realisieren.
Die Auflistung zeigt allerdings nur einen winzigen Ausschnitt der gegebenen Möglichkeiten. Eine umfassende Übersicht gibt es hier.
<html>...</html>
... bildet den Beginn und das Ende eines jeden HTML-Dokuments.
<head>...</head>
Im Browser nicht sichtbar; enhält Meta-Elemente, wie css-styles.
<title>...</title>
Wird im Registerreiter angezeigt; Titel für Bookmark.
<body>...</body>
Beginn und Ende des im Browser sichtbaren Bereichs.
<h1>...</h1>
Überschrift der ersten Kategorie
<h2>...</h2>
Überschrift der zweiten Kategorie - geht bis h6.
<p>...</p>
Definiert einen Standardabsatz
<b>...</b>
fett
<i>...</i>
kursiv
<a href=”link.de”>...</a>
Hyperlink. Optionen: target="_blank"...
<img src=”bild.jpg” alt=”bild” width=”X%”>
Fügt ein Bild ein. "alt" definiert Text der angezeigt wird, wenn das Bild nicht abgezeigt werden kann; die Größe des Bildes kann mit "width" (Breite) und "height" (Höhe) angepasst werden.
<ul>...</ul>
Aufzählung: ul=unsortiert ol=nummerierte Liste
<li>...</li>
Listenelemente
<br>
Fügt einen Zeilenumbruch ein.
<div>...</div>
Definiert einen Container
<span>...</span>
... definiert eine "Markierung".
<h1 class="myh1">...</h1>
Inline-Style: Fügt eine zuvor im Head definierte Klasse ein (vgl. CSS).
<p style=”color: red; font-size: 1.2em”>...</p>
Definiert einen Style nur für dieses eine Element
p {color: red; font-size: 1.2em}
Styledefinition im head. Gültig für alle Elemente dieses Typs im Dokument
<link rel="stylesheet" href="stylesheet.css">
Link zu einem externen Stylesheet (im head). Gültig für alle Dokumente, die diesen Link beinhalten.
.myh1 {color:red;text-align:center;}
Definiert eine eigene Klasse (im head oder externen Stylesheet). Kann im Dokument Elementen per class="" zugewiesen werden.
color:red
Schriftfarbe
font-family:verdana
Schriftart
font-size:1.2em
Schriftgröße in em, px oder %
text-align:center
Textausrichtung
background-color:red
Hintergrundfarbe
margin:; border:; padding:
Frage: Meine Seite wird nicht richtig angezeigt. Was ist los?
Antwort: Irgendwo wurde irgendetwas vergessen. Die häufigsten Fehlerquellen sind:
Bitte immer erst selbst den Fehler suchen, dann, wenn nötig, Hilfe holen!