forked from WEB-IMB-WS2526/lab-development-imb
01: Loesungen
parent
2ec59af12c
commit
8cae16327a
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 292 KiB |
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Überschriften</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>H1-Überschrift</h1>
|
||||
<h2>H2-Überschrift</h2>
|
||||
<h3>H3-Überschrift</h3>
|
||||
<h4>H4-Überschrift</h4>
|
||||
<h5>H5-Überschrift</h5>
|
||||
<h6>H6-Überschrift</h6>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
- Beispiel 1:
|
||||
- Variante A: schließender Tag fehlerhaft
|
||||
- Beispiel 2:
|
||||
- Variante B: Schließendes Tag fehlt.
|
||||
- Beispiel 3:
|
||||
- Variante B: img-Tag hat ist ein Void-Element, hat also kein schließendes Tag.
|
||||
- Beispiel 4:
|
||||
- Variante A: Schließendes Tag fehlt.
|
||||
- Beispiel 5:
|
||||
- Variante A: href-Attribut fehlt.
|
||||
- Beispiel 6:
|
||||
- Variante B: #-Marker fehlt in Sprungmarke.
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Struktur, Text, Sprungmarken und Links</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a href="#absatz10">Springe zu Absatz 10</a>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec auctor feugiat magna non consequat. Etiam
|
||||
volutpat
|
||||
elementum elit in ornare. Integer dictum egestas est, vitae cursus nisl varius a. Etiam ut nunc lacinia,
|
||||
suscipit
|
||||
turpis ut, euismod libero. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus
|
||||
mus.
|
||||
Pellentesque a ante libero. Vivamus scelerisque, dolor at tempus dignissim, mi nisl viverra elit, eu lacinia
|
||||
ipsum
|
||||
nulla vitae justo. Morbi maximus vestibulum lectus. Suspendisse vulputate, ligula sed tincidunt vehicula, augue
|
||||
augue euismod ipsum, in lacinia ex risus sit amet nisi. Orci varius natoque penatibus et magnis dis parturient
|
||||
montes, nascetur ridiculus mus. Nunc vestibulum, ipsum eget consequat porta, augue justo consequat ipsum, sed
|
||||
rutrum
|
||||
lacus turpis in lorem. Pellentesque consectetur varius aliquam.
|
||||
</p>
|
||||
<p>
|
||||
Morbi tincidunt varius lectus. Proin in massa et sem consequat ullamcorper. Curabitur aliquam ultricies neque
|
||||
quis
|
||||
semper. Praesent pellentesque semper mi, sit amet auctor justo hendrerit in. Sed congue mollis rutrum.
|
||||
Suspendisse
|
||||
ligula nulla, dapibus non ultricies ac, convallis vel odio. Maecenas suscipit metus nunc, non accumsan elit
|
||||
congue
|
||||
eget. Donec sit amet mi ut tellus efficitur posuere. Maecenas pellentesque vitae lectus quis feugiat.
|
||||
Suspendisse
|
||||
potenti. Praesent finibus diam at est pellentesque, imperdiet luctus enim varius. Etiam bibendum at dolor
|
||||
fringilla
|
||||
interdum. Nulla dictum vulputate velit, et viverra ipsum consequat eu.
|
||||
</p>
|
||||
<p>
|
||||
Fusce id euismod justo. Praesent posuere eros sed justo fringilla, id euismod metus consectetur. Sed volutpat
|
||||
tempor
|
||||
faucibus. Aenean pulvinar malesuada dictum. Etiam viverra augue non mi maximus, ut pellentesque quam congue.
|
||||
Nulla
|
||||
facilisi. Aenean cursus felis quis rhoncus rhoncus. Donec consectetur ullamcorper semper. Aliquam tristique elit
|
||||
sed
|
||||
pharetra tincidunt. Cras eget vehicula enim, in pulvinar elit. Aenean suscipit magna vel efficitur volutpat.
|
||||
Vestibulum sed accumsan lectus.
|
||||
</p>
|
||||
<p>
|
||||
Vivamus venenatis pellentesque ex nec egestas. Phasellus lobortis diam nec risus feugiat, a pretium odio
|
||||
ultricies.
|
||||
Nunc porttitor ac arcu at blandit. Nullam euismod faucibus odio, vel mattis eros convallis quis. Nulla suscipit
|
||||
elit
|
||||
arcu, eu pellentesque sapien mattis sed. Donec tempus nibh sed ultricies facilisis. Fusce eget tortor risus.
|
||||
</p>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec auctor feugiat magna non consequat. Etiam
|
||||
volutpat
|
||||
elementum elit in ornare. Integer dictum egestas est, vitae cursus nisl varius a. Etiam ut nunc lacinia,
|
||||
suscipit
|
||||
turpis ut, euismod libero. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus
|
||||
mus.
|
||||
Pellentesque a ante libero. Vivamus scelerisque, dolor at tempus dignissim, mi nisl viverra elit, eu lacinia
|
||||
ipsum
|
||||
nulla vitae justo. Morbi maximus vestibulum lectus. Suspendisse vulputate, ligula sed tincidunt vehicula, augue
|
||||
augue euismod ipsum, in lacinia ex risus sit amet nisi. Orci varius natoque penatibus et magnis dis parturient
|
||||
montes, nascetur ridiculus mus. Nunc vestibulum, ipsum eget consequat porta, augue justo consequat ipsum, sed
|
||||
rutrum
|
||||
lacus turpis in lorem. Pellentesque consectetur varius aliquam.
|
||||
</p>
|
||||
<p>
|
||||
Morbi tincidunt varius lectus. Proin in massa et sem consequat ullamcorper. Curabitur aliquam ultricies neque
|
||||
quis
|
||||
semper. Praesent pellentesque semper mi, sit amet auctor justo hendrerit in. Sed congue mollis rutrum.
|
||||
Suspendisse
|
||||
ligula nulla, dapibus non ultricies ac, convallis vel odio. Maecenas suscipit metus nunc, non accumsan elit
|
||||
congue
|
||||
eget. Donec sit amet mi ut tellus efficitur posuere. Maecenas pellentesque vitae lectus quis feugiat.
|
||||
Suspendisse
|
||||
potenti. Praesent finibus diam at est pellentesque, imperdiet luctus enim varius. Etiam bibendum at dolor
|
||||
fringilla
|
||||
interdum. Nulla dictum vulputate velit, et viverra ipsum consequat eu.
|
||||
</p>
|
||||
<p>
|
||||
Fusce id euismod justo. Praesent posuere eros sed justo fringilla, id euismod metus consectetur. Sed volutpat
|
||||
tempor
|
||||
faucibus. Aenean pulvinar malesuada dictum. Etiam viverra augue non mi maximus, ut pellentesque quam congue.
|
||||
Nulla
|
||||
facilisi. Aenean cursus felis quis rhoncus rhoncus. Donec consectetur ullamcorper semper. Aliquam tristique elit
|
||||
sed
|
||||
pharetra tincidunt. Cras eget vehicula enim, in pulvinar elit. Aenean suscipit magna vel efficitur volutpat.
|
||||
Vestibulum sed accumsan lectus.
|
||||
</p>
|
||||
<p>
|
||||
Vivamus venenatis pellentesque ex nec egestas. Phasellus lobortis diam nec risus feugiat, a pretium odio
|
||||
ultricies.
|
||||
Nunc porttitor ac arcu at blandit. Nullam euismod faucibus odio, vel mattis eros convallis quis. Nulla suscipit
|
||||
elit
|
||||
arcu, eu pellentesque sapien mattis sed. Donec tempus nibh sed ultricies facilisis. Fusce eget tortor risus.
|
||||
</p>
|
||||
<p>
|
||||
Vivamus venenatis pellentesque ex nec egestas. Phasellus lobortis diam nec risus feugiat, a pretium odio
|
||||
ultricies.
|
||||
Nunc porttitor ac arcu at blandit. Nullam euismod faucibus odio, vel mattis eros convallis quis. Nulla suscipit
|
||||
elit
|
||||
arcu, eu pellentesque sapien mattis sed. Donec tempus nibh sed ultricies facilisis. Fusce eget tortor risus.
|
||||
</p>
|
||||
<a id="absatz10">
|
||||
<h2>Absatz 10</h2>
|
||||
<p>
|
||||
Vivamus congue facilisis elit, ut malesuada nunc elementum a. In lacinia sit amet lacus et tempus. Cras a
|
||||
consectetur nulla. Aenean pretium sit amet metus quis posuere. Vestibulum ante ipsum primis in faucibus orci
|
||||
luctus
|
||||
et ultrices posuere cubilia curae; Fusce sagittis ut quam id luctus. Nunc commodo ligula et fermentum
|
||||
tristique.
|
||||
<a href="http://www.google.de">Gehe zu Google</a>
|
||||
Etiam feugiat sit amet odio et efficitur. Vivamus quis augue tristique ante interdum malesuada. Vestibulum
|
||||
sagittis
|
||||
enim erat, sit amet pretium purus aliquam ut.
|
||||
</p>
|
||||
</a>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Bilder</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Schöne Blumenbilder</h1>
|
||||
<h2>Vergissmeinnicht</h2>
|
||||
<img src="Bilder/Vergissmeinnicht.png" alt="Vergissmeinnicht" width="200px">
|
||||
<br>
|
||||
<h2>Rose</h2>
|
||||
<img src="Bilder/Rose.png" alt="Rose" width="200px">
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<base href="./Home/">
|
||||
<meta charset="utf-8">
|
||||
<title>Damen-Fahrräder</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>"Alle 🚲 für Damen in den Farben: Rot, Grün & Blau."</h1>
|
||||
</body>
|
||||
</htm>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<base href="./Home/">
|
||||
<meta charset="utf-8">
|
||||
<title>Herren-Fahrräder</title>
|
||||
</head>
|
||||
<body>
|
||||
Alles für Herren.
|
||||
</body>
|
||||
</htm>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<base href="./Home/">
|
||||
<meta charset="utf-8">
|
||||
<title>Unisex-Fahrräder</title>
|
||||
</head>
|
||||
<body>
|
||||
Alles für alle.
|
||||
</body>
|
||||
</htm>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<base href="./Home/" />
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="refresh" content="5; url=https://google.com">
|
||||
<title>Produkte</title>
|
||||
</head>
|
||||
<body>
|
||||
Link zu <a href="Herren/Fahrraeder.html">Herren-Fahrrädern</a>.
|
||||
Link zu <a href="Unisex/Fahrraeder.html">Unisex-Fahrrädern</a>.
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue