Sie sind auf Seite 1von 7

HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.

htm

Startseite
HTML & HTML5
CSS & CSS3
Beispielprojekte
JavaScript & Ajax
Bildbearbeitung
Web Apps
Videolernkurs

Schritt für Schritt lernen


die eigene Website zu erstellen

Jetzt das HTML-Seminar als


Video-Tutorial mit über 210 Videos,
Gesamtspielzeit über 24 Stunden
Video-Kurs HTML5+CSS+Webdesign

Sie befinden sich » Startseite » HTML Tutorial für Anfänger » HTML Befehle Übersicht

Übersicht HTML5-Befehle

HTML5-Grundgerüst
Bereiche einteilen über HTML5
Text strukturieren
Textstellen
Links, Verweise
Aufzählungen
Bereiche definieren
Farben

HTML-Befehle Übersicht
Die HTML5-Kurzreferenz listet alle wichtigen HTML-Befehle auf. Dabei wurden die Befehle thematisch
gruppiert. Die aufgelisteten HTML-Befehle sind die wichtigen!

In der Übersicht sind nur noch gültige HTML5-Befehle zu finden. Auch wenn die Liste kurz erscheint: es
sind alle wichtigen HTML-Befehle enthalten (außer für Formulare). HTML ist für die Struktur zuständig -

1 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

für Design wird CSS genutzt! Für CSS gibt es eine extra Auflistung der CSS-Anweisungen. Alle
veralteten HTML TAGs, die für Design zuständig waren, werden hier nicht aufgelistet,

Als Download gibt es die HTML5 und CSS Referenz im PDF-Format. Dort finden Sie alle wichtigen
HTML Tags und CSS-Anweisungen im Überblick (und zum schnellen Nachschlagen).

HTML5-Grundgerüst
HTML-Befehle Beschreibung
<!DOCTYPE html> HTML5-Doctype, erste Zeile der HTML-Datei
<html lang="de"> Umschließt den kompletten Inhalt und es wird
im Inhalt als Sprache Deutsch verwendet
<head> Head-Bereich, der Metainformationen über
die Webseite enthält (werden nicht im
Browserfenster angezeigt)
<meta charset="UTF-8" /> Verwendete Codierung - mit UTF-8 können
Sonderzeichen direkt genutzt werden (im
Deutschen z.B. Umlaute öäü)
<title>HTML5-Grundgerüst</title> Wichtig! Titel der Seite - hat mehrere wichtige
Funktionen:

Titelzeile im Browserfenster
Namen von gesetzten
Lesezeichen/Bookmarks
Liste der bereits besuchten Seiten
für den Eintrag bei Suchmaschinen in
der ersten Zeile

(engl. title=Titel)
</head>
<body> Umschließt den Inhalt, der im Browserfenster
angezeigt wird
INHALT Hier kommen nun der Inhalt (und alle
weiteren HTML-Befehle, die den Inhalt
strukturieren)
</body>
</html> Ende der HTML-Seite

Bereiche einteilen über HTML5


HTML5-Befehle Beschreibung
<header> Bereich für Kopf (nicht verwechseln mit
<head>!)
<nav> Bereich Navigation (Steuerung)
<section> Gruppiert Elemente
<article> Bereich für Inhalt
<aside> Bereich für Zusatzinformationen zum Inhalt

2 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

Bereiche einteilen über HTML5


HTML5-Befehle Beschreibung
<footer> Bereich für Fuß

Text strukturieren
HTML-Befehle Beschreibung
<h1> … </h1> Hauptüberschrift - wichtig, sollte 1 mal auf
jeder einzelnen Seite kommen
(engl. h = headline = Überschrift)
<h2> … </h2> Unterüberschriften - sollten in der logischen
bis Reihenfolge verwendet werden. Nach <h2>
<h6> … </h6> kommt <h3>
<p> … </p> Absatz - nach dem Absatz wird automatisch
Platz gehalten
(engl. p = paragraph = Absatz)
<br /> erzwungener Zeilenumbruch (Zeilenende)
(engl. br = break = Umbruch)
<hr /> Trennlinie - soll 2 unterschiedliche Inhalte
trennen
(engl. hr = horizontal ruler = horizontale Linie)

Textstellen hervorheben
HTML-Befehle (HTML-TAG) Beschreibung
<b> … </b> Schrift wird fett angezeigt
(engl. b = bold = fett)
<strong> … </strong> wichtiger Bereich, Schrift wird fett angezeigt
(engl. strong = kräftig, überzeugend)
<i> … </i> Schrift wird kursiv angezeigt
(engl. i = italic = kursiv, schräg)
<em> … </em> hervorgehobener Bereich, Schrift wird kursiv
dargestellt
(engl. em = emphasis = betont,
Hervorhebung)
<sup> … </sup> 2
hochgestellte Schrift, z.B. Fußnote
(engl. sup = superscript, zu Deutsch
hochstellen)
<sub> … </sub> tiefgestellte Schrift, z.B. H O
2
(engl. sub = subscript, zu Deutsch tiefstellen)
<del> … </del> durchstrichener Text, sprich Inhalt gilt nicht
mehr
(engl. del = deleted = gelöscht)
<ins> … </ins> neuer Inhalt im Text (gut um Änderungen
hervorzuheben)

3 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

Textstellen hervorheben
HTML-Befehle (HTML-TAG) Beschreibung
(engl. ins = inserted = neu eingefügt)
<small> … </small> für das "Kleingedruckte" im Text
(engl. small = klein)

Links, Verweise
HTML-Befehle (HTML-TAG) Beschreibung
<a href="URL">BESCHREIBUNG</a> für interne & externe Linkes.
"Beschreibung" wird später im Browser als
Link (blau unterstrichen) angezeigt und kann
angeklickt werden. Die URL innerhalb des
Attributs href wird aufgerufen
(engl. a = anchor = Anker)
(engl. href = hyper reference = Hypertext-
Referenz)
<a href="index.htm">STARTSEITE</a> interner Link
<a href="http://www.uxl.de/"> … externer Link
<a href="http://www.uxl.de/" neues (leeres) Browserfenster wird beim
target="_blank"> … Anklicken geöffnet
(engl. target = Ziel, blank = leer)
<a href="#xy"> … Sprungmarke (wird durch # gekennzeichnet)
zu einem bestimmten Punkt, hier "xy". Der
Punkt muss über das Attribut id definiert sein
<a So kann eine E-Mail-Adresse eingegeben
href="mailto:axl@uxl.de">axl@uxl.de</a> werden. Durch Anklicken öffnet sich ein
E-Mail-Programm (sofern installiert) und die
E-Mail-Adresse ist bereits eingegeben.
(e: mailto = maile nach)

Aufzählungen
HTML-Befehle (HTML-TAG) Beschreibung
<li>AUFZÄHLUNGSPUNKT</li> Bei allen Aufzählungen (nächste 2 Punkte)
müssen die Einzelpunkte durch diesen Tag
gekennzeichnet sein.
(engl. li = list item = Listeneintrag )
<ul> … </ul> Art der Auflistung. Umschließt alle einzelnen
<li>
Wird für Aufbau der Seitennavigation benötigt
und andere Aufzählungen (engl. ul =
unordered list = unsortierte Liste)
<ol> … </ol> Art der Auflistung. Umschließt alle einzelnen
<li>
Die einzelnen Listenpunkte bekommen dann
entsprechende Nummerierung 1., 2., 3. usw.

4 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

Aufzählungen
HTML-Befehle (HTML-TAG) Beschreibung
(engl. ol = ordered list = nummerierte Liste)

Bereiche definieren
HTML-Befehle (HTML-TAG) Beschreibung
<div id="NAME">BEREICH</div> Über DIV wird ein Bereich im HTML definiert.
Diesen Bereich kann man über CSS dann
das Design "überstülpen". Angesprochen wird
der Bereich über seinen ID-Namen. Bei DIV
handelt es sich um ein Blockelement - das
Blockelement nutzt die komplette
Bildschirmbreite.
(engl. div = division = Bereich, Gruppierung
von Elementen)
<div class="NAME">BEREICH</div> Der DIV-Bereich kann auch per CSS über
seinen Klassen-Namen angesprochen
werden.
(engl. class = Klasse)
<span id="NAME">BEREICH</span> Mit SPAN können Textstellen markiert werden
und diese dann über CSS mit Design
versehen werden. Das SPAN-Element ist ein
Inline-Element, was den Unterschied zum
DIV-Element ausmacht.
(engl. span = Abgrenzung, Bereich)
<span class="NAME">BEREICH</span> Kann über den Klassennamen und CSS mit
Design versehen werden.

Kommentieren, Auskommentieren
HTML-Befehle (HTML-TAG) Beschreibung
<!-- KOMMENTAR --> Über diese Anweisung können Kommentare
im HTML-Code gemacht werden bzw. Teile
<!-- des HTML-Codes auskommentiert werden.
QUELLCODE ohne Wirkung Somit sind diese Teile für einen Browser nicht
--> existent. Das ist z.B. gut zum Testen von
HTML-Befehlen.

Farben in HTML
HTML-Befehle (HTML-TAG) Beschreibung
- Farben werden über CSS genutzt!
Früher wurden auch mit Attributen bei
HTML-TAGs Farben festgelegt, was aber im
Sinne der Trennung von Inhalt und Design
heutzutage keinen Sinn mehr macht! Daher
gehören Farben (Design) in den CSS-Bereich
(zur Übersicht von CSS-Anweisungen)!

5 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

per Scriptly CSS lernen - Cascading Style Sheets für Webdesign

Facebook und Google+

Sehr geehrte Nutzer/innen dieser Website! Wir würden uns freuen, wenn Sie uns durch Facebook oder
Google+ unterstützen würden - sei es durch ein Like/+1 oder das Teilen dieser Seite. Allerdings legen wir
Wert auf Datenschutz und möchten nicht, dass diese Netzwerke Daten von Ihnen erhalten, sollten Sie dies
nicht wünschen. Deshalb sind die entsprechenden Buttons bei uns standardmäßig deaktiviert.

Durch einen Klick auf einen der unteren Buttons stimmen Sie der Nutzung/Speicherung Ihrer Daten (in
uns unbekanntem Ausmaß, uns unbekannten Orten und uns unbekannter Weise) zu und erhalten Zugriff
auf die Buttons. Wir bitten um Ihr Verständis und freuen uns über Ihre Unterstützung :)

Facebook
Google+

Startseite
HTML Tutorial für Anfänger
benötigte Software
erste HTML-Seite
Grundlagen - HTML-TAG
Absatz erstellen - p
Überschriften
HTML-Editor
HTML-Grundgerüst
Text fett b - strong
Text kursiv i oder em
Schachteln von HTML-TAGs
unterstreichen
validieren HTML-Seite
Sauberer HTML-Code
Listen, Aufzählungen
Definitionsliste
Attribute bei HTML-TAGs
Links, Hyperlinks
erzwungener Umbruch
Trennlinie, Attribute
Bilder, Fotos u. Grafiken integrieren
HTML Farben
Tabellen
Online stellen
HTML Befehle Übersicht
CSS lernen - Cascading Style Sheets für Webdesign
CSS3
Projekt Beispielwebsites
Bildbearbeitung für Websites
JavaScript, Ajax und jQuery
Fortgeschrittene
Web Apps erstellen
Forum

6 von 7 08.10.2013 17:19


HTML Befehle Übersicht mit HTML5 http://www.html-seminar.de/befehlsuebersicht.htm

Diverses
Impressum
Kontakt
Sitemap

das eBook zum HTML-Seminar.de


komplette Website als 357 Seiten eBook
zum Downloaden und Ausdrucken

Video-Tutorial: über 210 Videos,


Gesamtspielzeit über 24 Stunden
Video-Kurs HTML5+CSS+Webdesign

© 2000-2013 Axel Pratzner • www.html-seminar.de • Stand 29.7.2013


Wir freuen uns über Weiterempfehlungen und Links zu www.html-seminar.de

7 von 7 08.10.2013 17:19