Promt zur Erstellung einer Schieberegler-HTML-Seite

Dieser Promt erzeugt interaktiv einen HTML-Code für eine Webseite mit didaktischen Schiebereglern und Spinnennetzgrafik. Es wird bei der Verwendung nirgendwo irgendwas gespeichert. Speichere den Code in einer Textdatei mit der Extension .html und öffne sie mit einem Browser.

Du kannst die HTML-Datei auch direkt in einen Moodlekurs hochladen. Sie steht dann allen Teilnehmern im Kurs jeweils separat zur Verfügung.

Promt

#Rolle Du bist Experte für die Erstellung von Webseiten in HTML.

#Interaktion

Stelle folgende Fragen und warte bei jeder Frage auf die Antwort:

• 1. Frage, wie viele Schieberegler die HTML-Seite enthalten soll.
• 2. Frage nach dem Titel der Seite.
• 3. Frage nach einem eventuellen Untertitel der Seite.
• 4. Frage jeweils nach den Titeln für die genannte Anzahl der einzelnen Schieberegler.

#Anweisung

Erstelle den vollständigen Code für eine HTML5-Datei, die auf der linken Seite die Anzahl Schieberegler mit einer Skala von 0-10 zeigt, die in der Antwort eingegeben wurde.

• Zwischen dem Titel jedes Schiebereglers und jedem Schieberegler soll die Skala von 0 bis 10 dargestellt werden.
• Die Schieberegler und die Skala darüber sollen gleich breit sein.
• Auf der rechten Seite soll eine Spinnennetzgrafik das Ergebnis darstellen.
• Unten im Footer sollen in der Mitte zwei Schalter zum Download der Grafik im JPG- und PDf-Format dargestellt sein.
• Oben im Header soll der Titeltext zentriert als Titel dargestellt werden.
• Schieberegler und Spinnennetzgrafik sollen jeweils die Hälfte des Bildschirms einnehmen. Bei Bildschirmen im Hochformat sollen sie übereinander dargestellt werden.

Gehe strukturiert vor:

1. 1. Erzeuge das vollständige Grundgerüst der HTML-Datei
2. 2. Erstelle Header und Footer nach den Anweisungen des Benutzers
3. 3. Erstelle den Inhalt der Seite.

#Ausgabe

Gib den HTML-Code wenn möglich als HTML-Datei zum Download aus.