forked from WEB-IB-SS26/development-ib
Answers for exercises 1-4
parent
9c61e93038
commit
c20629a44c
|
|
@ -0,0 +1,87 @@
|
|||
# Aufgabe 1:
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>1. Testwebseite</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1> 1. Überschrift </h1>
|
||||
<h2> 2. Überschrift </h2>
|
||||
<h3> 3. Überschrift </h3>
|
||||
<h4> 4. Überschrift </h4>
|
||||
<h5> 5. Überschrift </h5>
|
||||
<h6> 6. Überschrift </h6>
|
||||
</body>
|
||||
```
|
||||
|
||||
# Aufgabe 2:
|
||||
|
||||
## Beispiel 1:
|
||||
```html
|
||||
<h1>Willkommen<h1> <!--Variante A -->
|
||||
<h1>Willkommen</h1> <!--Variante B -->
|
||||
```
|
||||
Antwort: Variante A ist falsch, da der 2. \<h1> tag kein schließender Tag ist.
|
||||
|
||||
## Beispiel 2:
|
||||
```html
|
||||
<p>Dies ist ein Absatz.</p> <!--Variante A -->
|
||||
<p>Dies ist ein Absatz. <!--Variante B -->
|
||||
```
|
||||
Antwort: Variante B ist falsch, da der End Tag fehlt.
|
||||
|
||||
## Beispiel 3:
|
||||
```html
|
||||
<img src="bild.jpg" alt="Beschreibung"> <!--Variante A -->
|
||||
<img>bild.jpg</img> <!--Variante B -->
|
||||
```
|
||||
Antwort: Variante B ist falsch, da die Attribute für den <img> Tag nicht verwendet wurden.
|
||||
|
||||
## Beispiel 4:
|
||||
### Variante A:
|
||||
```html
|
||||
<ul>
|
||||
<li>Erster Punkt
|
||||
<li>Zweiter Punkt
|
||||
</ul>
|
||||
```
|
||||
|
||||
### Variante B:
|
||||
```html
|
||||
<ul>
|
||||
<li>Erster Punkt</li>
|
||||
<li>Zweiter Punkt</li>
|
||||
</ul>
|
||||
```
|
||||
Antwort: Variante A ist falsch, da die schließenden Tags für die entsprechenden Listeneinträge fehlen.
|
||||
|
||||
## Beispiel 5:
|
||||
### Variante A:
|
||||
```html
|
||||
<a "https://example.com">Zur Website</a>
|
||||
```
|
||||
|
||||
### Variante B:
|
||||
```html
|
||||
<a href="https://example.com">Zur Website</a>
|
||||
```
|
||||
Antwort: Variante A ist falsch, da das "href" Attribut nicht gesetzt worden ist.
|
||||
|
||||
## Beispiel 6:
|
||||
### Variante A:
|
||||
```html
|
||||
<a href="#kontakt">Zum Kontaktbereich springen</a>
|
||||
...
|
||||
<h2 id="kontakt">Kontakt</h2>
|
||||
```
|
||||
|
||||
### Variante B:
|
||||
```html
|
||||
<a href="kontakt">Zum Kontaktbereich springen</a>
|
||||
...
|
||||
<h2 id="kontakt">Kontakt</h2>
|
||||
```
|
||||
Antwort: Variante A ist falsch, da der "href" Attributwert keine Raute enthält.
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a href="#sprung10">Zum 10. Absatz springen</a>
|
||||
|
||||
<h2>1. Absatz</h2>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo semper velit, eu consectetur quam mollis
|
||||
eget. In tristique iaculis diam pharetra finibus. Quisque rhoncus vel leo nec vulputate. Nulla ullamcorper porta
|
||||
odio id molestie. Nunc sollicitudin lorem a libero faucibus, quis elementum erat posuere. In vulputate egestas
|
||||
ante, eget sodales nisi lacinia ut. Aliquam quis erat venenatis ex tristique finibus. Quisque et consectetur
|
||||
metus. Pellentesque vitae pretium eros. Sed nec porta nulla. Curabitur eu placerat mi. Nunc sed posuere sapien.
|
||||
</p>
|
||||
|
||||
<h2>2. Absatz</h2>
|
||||
<p>
|
||||
Nam vitae nulla turpis. Proin est sem, finibus quis sagittis eget, luctus eu justo. Phasellus mauris sem,
|
||||
commodo eget arcu et, porta fringilla turpis. Cras a erat sed metus placerat vehicula. Etiam scelerisque
|
||||
vestibulum erat id laoreet. Phasellus condimentum odio quis nisl tempor iaculis in id orci. Integer rutrum
|
||||
lectus a metus euismod maximus. Nam porta, purus ac fermentum semper, ipsum est accumsan nunc, eu finibus leo
|
||||
libero nec massa. Sed augue ex, efficitur in libero id, posuere ullamcorper ante. Cras feugiat tempor magna, at
|
||||
cursus augue aliquam ac.
|
||||
</p>
|
||||
|
||||
<h2>3. Absatz</h2>
|
||||
<p>
|
||||
Vestibulum vel mauris ac purus ultrices molestie. Mauris dictum, lorem nec hendrerit pretium, lectus urna
|
||||
pulvinar eros, vitae vestibulum lectus turpis vel ipsum. Nunc accumsan ante et enim euismod pellentesque.
|
||||
Phasellus pulvinar turpis nec dui aliquet, et ultricies ante gravida. Nulla ultrices vel tellus eget hendrerit.
|
||||
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec feugiat, risus non
|
||||
mattis lacinia, ante velit pretium mi, vitae posuere nunc sem eget neque. Praesent mi justo, mollis ac maximus
|
||||
sed, congue in augue. Nulla eleifend risus vitae leo faucibus facilisis. Quisque egestas vel diam at convallis.
|
||||
</p>
|
||||
|
||||
<h2>4. Absatz</h2>
|
||||
<p>
|
||||
Mauris in maximus nulla. Etiam neque turpis, rhoncus vel libero id, vulputate tempor ante. Ut aliquet vulputate
|
||||
odio, vel fermentum mauris. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus
|
||||
mus. Suspendisse tempor metus magna, ut elementum diam imperdiet a. Praesent pharetra ante arcu, ac tempus
|
||||
lectus auctor in. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In
|
||||
vitae dui sit amet elit dapibus lobortis. Vivamus consequat lorem quis est aliquet, accumsan tincidunt mi
|
||||
dignissim.
|
||||
</p>
|
||||
|
||||
<h2>5. Absatz</h2>
|
||||
<p>
|
||||
Donec pellentesque risus id lorem ullamcorper suscipit. Sed nec venenatis risus. Proin ultrices purus sit amet
|
||||
dictum posuere. Phasellus et euismod ex. Curabitur lacinia laoreet mi vel suscipit. Proin posuere eros eu urna
|
||||
ullamcorper, eget pretium tellus dignissim. Suspendisse varius ex est, et tempor elit convallis sed.
|
||||
Pellentesque et diam id purus mattis malesuada a eu erat. Pellentesque habitant morbi tristique senectus et
|
||||
netus et malesuada fames ac turpis egestas.
|
||||
</p>
|
||||
|
||||
<h2>6. Absatz</h2>
|
||||
<p>
|
||||
Cras blandit ultrices augue, vel aliquam sem lacinia quis. Proin dapibus tortor nibh, nec varius lorem blandit
|
||||
sit amet. Duis maximus ex at tincidunt consequat. Cras sodales nisl quis est ornare, in molestie elit viverra.
|
||||
Donec semper pellentesque laoreet. Nullam faucibus sodales euismod. Nunc erat mi, luctus nec est ac, tempus
|
||||
dignissim eros. Vestibulum a magna felis.
|
||||
</p>
|
||||
|
||||
<h2>7. Absatz</h2>
|
||||
<p>
|
||||
Nulla auctor malesuada placerat. Morbi luctus tortor at enim vehicula imperdiet. Nulla sed feugiat nisl. Nullam
|
||||
vestibulum iaculis dapibus. Etiam ac hendrerit purus, sit amet lobortis est. Mauris eu dui vel massa placerat
|
||||
volutpat ut at risus. Donec in euismod nisl, in tempus mauris.
|
||||
</p>
|
||||
|
||||
<h2>8. Absatz</h2>
|
||||
<p>
|
||||
Ut rutrum sem sit amet volutpat iaculis. Quisque vehicula velit leo, nec luctus leo accumsan blandit. Nam
|
||||
pretium justo non tempus ultricies. Ut ultrices in arcu in vehicula. Nullam blandit, sem ut dapibus finibus, sem
|
||||
ligula pellentesque sapien, et rutrum est tellus sit amet sem. Ut sit amet tortor lacinia turpis auctor posuere.
|
||||
Nam hendrerit erat vitae varius bibendum. Donec eu dictum lacus. Mauris finibus, arcu eget volutpat gravida,
|
||||
libero arcu efficitur neque, quis maximus nulla diam in quam. Suspendisse et arcu non arcu mollis luctus in sit
|
||||
amet libero. Mauris id turpis eget odio tincidunt consectetur vel quis nisi. Suspendisse nec tellus orci. Donec
|
||||
id quam vel libero finibus dictum. Phasellus eleifend dolor ut est volutpat gravida.
|
||||
</p>
|
||||
|
||||
<h2>9. Absatz</h2>
|
||||
<p>
|
||||
Mauris luctus orci eu velit bibendum, eget facilisis nibh feugiat. Praesent tincidunt viverra congue. Aliquam
|
||||
non ligula quis lorem rhoncus dictum. Vivamus porta eu ante eget cursus. Nunc a libero sit amet mi mattis
|
||||
euismod. Donec posuere sollicitudin ipsum a consectetur. Pellentesque sit amet vestibulum tortor. Curabitur id
|
||||
ex non eros auctor tempus in vel tellus. Aliquam condimentum ex a nibh tincidunt, at placerat tortor pulvinar.
|
||||
In aliquam, elit vitae volutpat convallis, sapien mauris vehicula mauris, eu placerat elit augue sit amet
|
||||
lectus. Pellentesque blandit venenatis eros, non varius orci hendrerit a. Proin diam mi, mollis vel sollicitudin
|
||||
id, ullamcorper et mauris. Ut malesuada pharetra nunc, vitae ultrices arcu. Nullam aliquet lobortis dui, et
|
||||
pellentesque enim sollicitudin non. Nullam nulla lorem, malesuada quis est sed, sollicitudin mollis urna.
|
||||
</p>
|
||||
|
||||
<h2 id="sprung10">10. Absatz</h2>
|
||||
<p>
|
||||
Proin auctor ullamcorper dapibus. Sed semper congue turpis, eu commodo nisi aliquam et. Ut placerat dignissim
|
||||
leo, ut commodo nibh fermentum vel. Maecenas sed elementum augue. Etiam semper lacinia velit, sed aliquet tellus
|
||||
pharetra non. Integer ac purus ligula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sodales
|
||||
suscipit diam ac viverra. Vestibulum at orci in dui hendrerit mollis quis ac orci. Integer sed justo id libero
|
||||
dapibus dictum sit amet at magna. Nullam commodo diam id mauris gravida, vitae egestas ipsum consectetur. Nulla
|
||||
eu quam urna. Mauris aliquam ligula sit amet libero bibendum scelerisque. Duis lobortis posuere nisl sit amet
|
||||
vehicula. Mit <a href="http://google.de">google erstellt</a>
|
||||
</p>
|
||||
|
||||
</body>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
</head>
|
||||
<body>
|
||||
<img src="Pictures_Aufgabe_4/binary.jpg" alt="Ein Bild mit Nullen und Einsen" title="Binärsequenzen" width="200px">
|
||||
<br>
|
||||
<img src="Pictures_Aufgabe_4/library.jpg" alt="Ein Bild von einer Bibliothek" title="Bibliothek" width="200px">
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 878 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 819 KiB |
Loading…
Reference in New Issue