Publicera ditt projekt
Du har gjort ändringar sedan du senast publicerade detta projekt.
Projektet verkar ta lång tid att ladda.
Om det inte laddas, vänligen ladda om sidan och försök igen.
Om det inte hjälper, kontakta oss.
Vänligen uppdatera din webbläsare för att ladda in Thimble igen.
För felinformation öppna webbläsarens konsol för utvecklingsverktyg.
OBS: om du använder Privat surfläge, vänligen ladda om i vanligt läge.
<!-- Lägg till din kommentar här -->
<table> <tr> <th>Rubrik</th> <th>Rubrik</th> </tr> <tr> <td>Värde</td> <td>Värde</td> </tr> </table>
<ol> <li>Objekt 1</li> <li>Objekt 2</li> <li>Objekt 3</li> </ol>
<ul> <li>Objekt 1</li> <li>Objekt 2</li> <li>Objekt 3</li> </ul>
<form action="" method="get"> <label for="first-name">Förnamn</label> <input id="first-name" type="text" name="firstname"><br> <label for="last-name">Efternamn</label> <input id="last-name" type="text" name="lastname"><br> <input type="submit" value="Skicka in"> </form>
<script src="script.js"></script>
<!-- Lägg till taggen <link> till din HTML-fil. Vanligtvis är den i taggen <head> --> <link href="style.css" rel="stylesheet">
<video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Din webbläsare stöder inte videotaggen. </video>
<audio controls> <source src="audio.mp3" type="audio/mpeg"> Din webbläsare stöder inte ljudtaggen. </audio>
/* Lägg till din kommentar här */
p { font-size: 20px; }
.className { background-color: green; }
#idName { background-color: green; }
/* Elementet att applicera animationen på */ .animated { animation-name: animationName; animation-duration: 4s; animation-iteration-count: infinite; animation-timing-function: ease-out; } /* Animeringskoden */ @keyframes animationName { 0% { background-color: red; } 50% { background-color: orange; } 100% { background-color: yellow; } }
/* Grundläggande stil */ a:link { color: RoyalBlue; text-decoration: none; } /* Besökt */ a:visited { color: Orchid; } /* Aktiv */ a:active { color: OrangeRed; } /* Svept över */ a:hover { text-decoration: underline; }
@media screen and (max-width: 320px) { /* Regler när skärmen är upp till 320px bred */ } @media screen and (min-width: 321px) and (max-width: 768px) { /* Regler när skärmen är mellan 321px och 768px bred */ } @media screen and (min-width: 769px) { /* Regler när skärmen är bredare än 768px */ }
@font-face { font-family: myFirstFont; src: url(sansation_bold.woff); font-weight: bold; }
/* Lägger till en pil innan varje element med klass='arrow' */ .arrow::before { content: "→"; background: DodgerBlue; color: white; }
// Lägg till din kommentar här
function sayHello(name) { console.log("Hej, " + name); } sayHello("David");
var names = ["David", "Bob", "Kate"];
var person = { name: "Bob", skills: ["JS", "HTML"] };
var names = ["David", "Bob", "Kate"]; 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 = "Bob"; if (name === "Bob") { console.log("Hej, " + name); } else if (name === "Kate") { console.log("Hej, " + name); } else { console.log("Hej främling!"); }
var name = "Bob"; switch(name) { case "Bob": console.log("Hej, " + name); break; case "Kate": console.log("Hej, " + name); break; default: // Gör något om inga villkor uppfylldes console.log("Hej främling!"); }
// Välj ett element med id="button" var element = document.querySelector('#button'); element.addEventListener("click", function() { console.log("Click!"); });
// Välj elementet med id='alert' var element = document.querySelector('#alert'); element.style.background = "OrangeRed";
Du har gjort ändringar sedan du senast publicerade detta projekt.