HTML basics
w3schools sehr gute seite für das Zeug
) = >
( = <
Allgemein
- alles mit (html) öffnen und mit (/html) schließen
- Browserfenster: (head)(title)TITEL(/title)(/head)
- Alles in (body) schriben und mit (/body) schließen
- Überschriften: (h1)ÜS(/h1) , (h2)ÜS(/h2) , usw um kleiner zu machen
- (p) Paragraph (/p)
- (br) für nächste Zeile
- (hr) für eine Linie
Aufzählungen
- mit (Form) öffnen
- jede Zeile mit (li) öffnen
- jede Zeile mit (/li) schließen
- mit (/Form) schließen
- (ul) für Punkte
- in gleiche ( ) style="Type"
- Types:
- "list-style-type:none" für keine Punkte
- "list-style-type:circle" für kleine Kreise
- "list-style-type:square" für eckige Punkte
- (ol) für eine Nummerierte Liste
- in gleiche ( ) type="Type"
- Types:
- "A" für große Buchstaben (Alphabet)
- "a" für kleine Buchstaben (Alphabet)
- "I" für große römischen Zahlen
- "i" für keine römischen Zahlen
Schriftarten
- (b) Dicke Schrift (/b)
- (i)kursive Schrift(/i)
- (small) kleine Schrift (/small)
- (u)unterstrichene Schrift(/u)
(del)durchgestrichene Schrift(/del)- (mark)markierter Text(/mark)
- (sub)kleiner Text unten(/sub)
- (sup)kleiner Text oben(/sup)
Links
- mit (a) öffnen und mit (/a) schließen
- wird in diesem Tab geöffnet:
(a href="Link")Angezeigt(/a)
Bsp: Youtube Link
https://www.youtube.com/ - wird in neuem Tab geöffnet:
(a href="link" target="_blank" rel="noopener")Angezeigt(/a)
Bsp: Youtube Link
https://www.youtube.com/ - Download:
(a href="Link/Verzeichnis" download)Angezeigt(/a)
Bsp: Download(Eisenbahn Bild)
Testbild Download
Hintergrund-/Farben
(p style="background-color:Farbe/#Farbcode;")Text(/p)
GRÜN
(p style="color:Farbe/#Farbcode;")Text(/p)
PINK
- geht nicht nur mit (p)
- Farbcodes
Tabellen
- (table) zum öffnen und (/table) um zu schließen
- (tr) um eine Zeile zu öffnen und (/tr) zum schließen
- (td) um eine Spaalte zu öffnen und (/td) zum schließen
- (th) um Kopfzellen zu erstellen und (/th) zum schließen
| 7 | 8 | 9 |
|---|---|---|
| 4 | 5 | 6 |
| 1 | 2 | 3 |
Bilder
- (img src="Link")
- (img src="Unterverzeichnis/Bildnahme.png")
- in die gleiche ( ) für Titel: title="Titel"
- in die gleiche ( ) für Breite: width="Pixel"
- in die gleiche ( ) für Höhle: height="Pixel"
- nicht wichtig: in die gleiche () für Erklärung: alt="Erklärung"
- in gleiche ( ) für den Rahmen: border="Zahl"
- in gleiche ( ) für die Positionierung: algin="top/bottom/middle/left/right"
- in gleiche ( ) für den Abstand Waagerecht zu anderen Sachen: hspace="Zahl"
- in gleiche ( ) für den Abstand Senkrecht zu anderen Sachen: vspace="Zahl"
Beispiel (mit Unterverzeichnis):
Buttons
- (button) Nachricht (/button)
- (button onclick="alert('Alert')") Nachricht (/button) für ein PoP-UP vom Browser, bei Altert wirklich ( )
- (input type="button" value="Nachricht" onclick="window.location.href='Link/Verzeichnis'" /) um diese Seite zu schließen
- (button onclick="window.open('Link/Verzeichnis','_blank')")zu Google(/button)um ein neuen Tab zu öffnen, bei Link wirklich ( )
(keine Funktion)
(Alert)
(diese Seite wird geschlossen)
(neuer Tab wird geöffnet)
Fenster/Videos
- (iframe width="länge" height="höhe" src="Link")(/iframe)
- Bei Youtube Video: Teilen -> Einbetten -> Optionen wählen -> kopieren
- Youtube: "allowfullscreen" löschen um Fullscreen zu verbiten
- Youtube: hinter ? : "autoplay=1" um das Video automatisch abzuspielen
Beispiel (Youtube Video ohne Autoplay):
Beispiel (Youtube Video mit Autoplay): GERADE AUS!
Beispiel (Internetseite(ILoveRaio)):
