Listen von Knoten
Mehrere Attribute
Auf der vorherigen Seite wurden der a Funktion zwei Listen
übergeben. Diese enthielten jeweils nur ein Element.
Bei Bildern reicht ein einzelnes Attribut oft nicht aus:
main =
img
[ src "https://kurzelinks.de/caesarbild"
, width 100
, alt "Caesar"
]
[]
Der DOM-Teilbaum lässt sich so darstellen:
HTML
Wir erzeugen den DOM-Baum mit Hilfe von Elm, nicht mit HTML. Zur Verdeutlichung aber hier der HTML-Code, der die gleiche Wirkung hätte:
<img src="https://kurzelinks.de/caesarbild" width="100" alt="Caesar">
Aufgabe 1
Ersetze in deinem Projekt den Link durch das Bild gemäß dem Code oben.
Ergänze ähnlich dem Lückentext auf der vorherigen Seite:
-
imgist eine ... -
srcist eine ... -
widthist eine ... -
altist eine ...
Mehrere Textknoten
Analog kannst du mehrere Textknoten in einer Liste erzeugen:
main =
div []
[ text "HALLO"
, text " "
, text "KDOOR"
]
Der erzeuge DOM-Teilbaum hat folgende Gestalt:
HTML
Wir erzeugen den DOM-Baum mit Hilfe von Elm, nicht mit HTML. Zur Verdeutlichung aber hier der HTML-Code, der die gleiche Wirkung hätte:
<div>
HALLO
KDOOR
</div>
Aufgabe 2
Teste auch diese Variante.
