|
|
| (Eine dazwischenliegende Version desselben Benutzers wird nicht angezeigt) |
| Zeile 1: |
Zeile 1: |
| Der Weg zur ersten Webseite ist denkbar einfach und bringt schnelle Ergebnisse!
| |
|
| |
|
| {{Aufgabe|#Erstelle Deine eigene Webseite!
| | #redirect [[HTML_und_CSS/HTML_als_Auszeichnungssprache]] |
| ## Kopiere den untenstehenden Code in einen [https://wiki.selfhtml.org/wiki/HTML/Tutorials/Webprojekte/entwickeln#Code-Editor Code-Editor] wie NotePad++.
| |
| ## Speichere es als <code>meineSeite.html</code>
| |
| ## Öffne es in einem Browser.
| |
| ## Jetzt kannst Du den Inhalt der Seite nach Belieben ändern!
| |
| # Neue Elemente
| |
| ## Kannst Du Deine Hobbys in einer Liste nach Priorität sortieren? Finde das richtige HTML-Element dafür!
| |
| ## Kannst Du einen Verweis/Link zu Deinem Sportverein, Deiner Schule oder Deinem Hobby einbauen?
| |
| ## Füge Bilder in Deine Webseite ein!
| |
| # Unten findest Du interaktive Übungen. Weißt Du schon alles?}}
| |
| | |
| <source lang="html5"><pre>
| |
| <!DOCTYPE html>
| |
| <html lang="de">
| |
| <head>
| |
| <meta charset="utf-8">
| |
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
| |
| <title>meine Seite</title>
| |
| </head>
| |
| <body>
| |
| <h1>Überschrift</h1>
| |
| <p>Ich bin ...</p>
| |
|
| |
| <h2> Meine Hobbies</h2>
| |
| <ul>
| |
| <li><a href="https://unterrichten.zum.de/wiki/">Unterrichten-ZUM-Wiki</a></li>
| |
| </ul>
| |
| </body>
| |
| </html></pre></source>
| |
| | |
| {{HTML und CSS}}
| |
| | |
| == Interaktive Übungen ==
| |
| === semantische Auszeichnung einer Webseite ===
| |
| <div class="zuordnungs-quiz">
| |
| Ordne die HTML-Elemente den Beschreibungen zu.
| |
| {|
| |
| | Überschrift erster Ordnung || <h1>
| |
| |-
| |
| | Sidebar für zusätzliche Informationen || <aside>
| |
| |-
| |
| | Textabsatz || <p>
| |
| |-
| |
| | Verweis auf eine andere Seite || <a href="">
| |
| |-
| |
| | Einbindung eines Bilds || <img src="" alt="">
| |
| |-
| |
| | Kopfbereich || <header>
| |
| |}
| |
| </div>
| |
| | |
| === Quiz ===
| |
| <iframe src="//LearningApps.org/watch?app=540054" style="border:0px;width:100%;height:500px" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
| |
| | |
| === HTML-Syntax - Zuordnung ===
| |
| <iframe src="//LearningApps.org/watch?app=235834" style="border:0px;width:100%;height:500px" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
| |
