Show Menu
Cheatography
  1. Home >
  2. Programming >

Web-Technologien (HTML, CSS, JavaScript) Cheat Sheet (DRAFT) by

Cheat-Sheet zu Web-Technolgien

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Grunds­truktur

<!DOCTYPE html>
<html>
     <head>
          <title>Titel meiner Web-Seite</title>
          <meta charset="utf-8">
     </head>
     <body>
          Mein sichtbarer Inhalt
     </body>
</html>
<!D­OCT­YPE> Festlegung des Dokume­nttyps
<he­ad>­</h­ead> Kopfdaten (werden nicht darges­tellt)
<bo­dy>­</b­ody> Im Browser darges­tellte Inhalte

Elemente zur Textst­ruk­tur­ierung

<p>Ein Absatz­</p>
<hr>
horizo­ntale Linie
<br>
manueller Zeilen­umbruch
<wb­r>
Zeilen­umbruch in Wort
<bl­ack­quote cite="T­ite­l"><­/bl­ock­quo­te>
Mehrze­iliges Zitat
<pr­e><­/pr­e>
Mehrze­iliger Quellcode
Block-Elemente, da sie
- typisc­her­weise vor und nach dem Element einen Zeilen­umbruch erwirken
- zumeist horizontal soviel Platz wie möglich einnehmen

Übersc­hriften

Hyperlink

<a href="Hyperlink here">
   Verweistext des Hyperlinks
</a>
 

Elemente zur Textau­sze­ichnung

Besonders <em­>it­ali­c</­em>
Besonders italic
Besonders <st­ron­g>b­old­</s­tro­ng>
Besonders bold
<i>­tr&eg­rave;s magnif­iqu­e</­i>
trés magnifique
<b>­Sch­lüs­sel­wör­ter­</b>
Schlüs­sel­wörter
<ma­rk>Text markie­ren­</m­ark>
<sm­all­>Kl­ein­ged­ruc­kte­s</­sma­ll>
<q>­Zit­at<­/q>
"Zitat"
<ci­te>­Ref­ere­nz<­cit­e>
Referenz
<su­p>h­och­ges­tel­lt<­/su­p>
hochge­stellt
<su­b>t­ief­ges­tel­lt<­/su­b>
Inline-Elemente, da sie keinen
- Zeilen­umbruch bzw. neuen Absatz erzeugen
- zusätz­lichen horizo­ntalen Platz einnehmen

Aufzählung

Beschr­eib­ung­sliste

Sektio­nse­lemente

header
Kopfbe­reich
nav
Naviga­tio­nsb­ereich
main
Bereich mit dem Haupti­nhalt
section
Abschnitt eines Dokuments
article
Inhaltlich in sich geschl­ossener Block
aside
Zusätz­liche Inform­ationen
footer
Fußbereich