Ihr Projekt veröffentlichen
Sie haben seit der letzten Veröffentlichung dieses Projekts etwas geändert.
Ihr Projekt lädt ungewöhnlich lange.
Wenn es nicht geladen wird, laden Sie die Seite bitte neu, um es erneut zu versuchen.
Wenn dies nicht hilft, senden Sie uns eine Nachricht.
Bitte laden Sie Ihren Browser neu, um Thimble erneut zu laden.
Details zu diesem Fehler finden Sie in der Konsole der Entwickler-Werkzeuge Ihres Browsers.
HINWEIS: Wenn Sie den Privaten Modus verwenden, laden Sie bitte im normalen Modus neu.
<!-- Fügen Sie hier Ihren Kommentar ein -->
<table> <tr> <th>Überschrift</th> <th>Überschrift</th> </tr> <tr> <td>Wert</td> <td>Wert</td> </tr> </table>
<ol> <li>Element 1</li> <li>Element 2</li> <li>Element 3</li> </ol>
<ul> <li>Element 1</li> <li>Element 2</li> <li>Element 3</li> </ul>
<form action="" method="get"> <label for="first-name">Vorname</label> <input id="first-name" type="text" name="firstname"><br> <label for="last-name">Nachname</label> <input id="last-name" type="text" name="lastname"><br> <input type="submit" value="Absenden"> </form>
<script src="script.js"></script>
<!-- Fügen Sie Ihrer HTML-Datei einen <link>-Tag hinzu. Üblicherweise gehört er in den <head>-Tag. --> <link href="style.css" rel="stylesheet">
<video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Ihr Browser unterstützt das Video-Tag nicht. </video>
<audio controls> <source src="audio.mp3" type="audio/mpeg"> Ihr Browser unterstützt das Audio-Tag nicht. </audio>
/* Fügen Sie hier Ihren Kommentar ein */
p { font-size: 20px; }
.className { background-color: green; }
#idName { background-color: green; }
/* Das Element, auf das die Animation angewendet wird */ .animated { animation-name: animationName; animation-duration: 4s; animation-iteration-count: infinite; animation-timing-function: ease-out; } /* Der Quelltext der Animation */ @keyframes animationName { 0% { background-color: red; } 50% { background-color: orange; } 100% { background-color: yellow; } }
/* Grundlagen-Style */ a:link { color: RoyalBlue; text-decoration: none; } /* Besucht */ a:visited { color: Orchid; } /* Aktiv */ a:active { color: OrangeRed; } /* Überfahren */ a:hover { text-decoration: underline; }
@media screen and (max-width: 320px) { /* Regeln, wenn Bildschirm bis zu 320 px breit ist */ } @media screen and (min-width: 321px) and (max-width: 768px) { /* Regeln, wenn Bildschirm zwischen 321 px und 768 px breit ist */ } @media screen and (min-width: 769px) { /* Regeln, wenn Bildschirm breiter als 768 px ist */ }
@font-face { font-family: myFirstFont; src: url(sansation_bold.woff); font-weight: bold; }
/* Fügt einen Pfeil vor jedem Element mit class='arrow' ein */ .arrow::before { content: "→"; background: DodgerBlue; color: white; }
// Fügen Sie hier Ihren Kommentar ein
function sayHello(name) { console.log("Hallo " + name); } sayHello("David");
var names = ["David", "Robert", "Katharina"];
var person = { name: "Robert", skills: ["JS", "HTML"] };
var names = ["David", "Robert", "Katharina"]; var name; for (var i = 0; i < names.length; i++) { name = names[i]; console.log(name); }
var count = 5; while (count > 0) { console.log(count); count = count - 1; }
var name = "Robert"; if (name === "Robert") { console.log("Hallo " + name); } else if (name === "Katharina") { console.log("Hallo " + name); } else { console.log("Hallo Fremder!"); }
var name = "Robert"; switch(name) { case "Robert": console.log("Hallo " + name); break; case "Katharina": console.log("Hallo " + name); break; default: // Etwas tun, wenn keine Bedingung erfüllt wurde console.log("Hallo Fremder!"); }
// Ein Element mit id="button" auswählen var element = document.querySelector('#button'); element.addEventListener("click", function() { console.log("Click!"); });
// Das Element mit id='alert' auswählen var element = document.querySelector('#alert'); element.style.background = "OrangeRed";
Sie haben seit der letzten Veröffentlichung dieses Projekts etwas geändert.