HTML Editor: Code & Preview

Zet een webidee om in een werkende pagina met HTML Editor. Schrijf HTML met ingebedde CSS en JavaScript, bekijk het resultaat en gebruik korte lessen om de code die je aanpast te begrijpen. Het is een praktische werkomgeving voor studenten, beginners en ontwikkelaars die experimenteren met kleine webpagina's op een mobiel apparaat.

SCHRIJF EN CONTROLEER JE CODE

Werk in een code-editor met syntaxmarkering, haakjeskoppeling, automatisch sluiten en ongedaan maken en opnieuw uitvoeren. Toon regelnummers, zoek tekst of spring naar een regel wanneer een codefragment groeit. De extra symbolenwerkbalk plaatst veelgebruikte codetekens binnen handbereik, zodat het invoeren van tags en expressies minder vaak wisselen tussen toetsenbordindelingen vereist.

Schakel tussen de tabbladen Code, Uitvoer en Console. De uitvoerweergave toont je document in de app, inclusief stijlen en scripts. Gebruik automatische previewverversing tijdens het bewerken of schakel deze uit als je zelf wilt bepalen wanneer het resultaat wordt bijgewerkt. Consoleberichten helpen je te controleren wat de JavaScript van je pagina doet.

VERKEN VERSCHILLENDE VOORBEELDBREEDTES

Kies de voorvertoningsmodus voor telefoon, tablet of desktop om te zien hoe een lay-out zich gedraagt ​​bij verschillende breedtes. Dit zijn weergaven binnen de app, handig om de afstand en de indeling te controleren tijdens het werken aan een responsief ontwerp. Probeer een koptekst, pas een stijlregel aan en ga vervolgens terug naar de uitvoer om het effect te zien.

LEER EEN CONCEPT EN OEFEN HET DAN

De leermodus combineert onderwerpen over HTML, CSS en JavaScript. Filter op onderwerp of zoek naar een concept in plaats van alles in volgorde te lezen. Elke les bevat een uitleg, een snelle tip, praktische toepassingen, veelvoorkomende valkuilen, een voorbeeld en een code-walkthrough.

Volg een les met twee korte codeertaken. Herstel eerst een voorbeeld en schrijf vervolgens een nieuw codefragment met behulp van het concept. Controleer je antwoord, lees de feedback en reset de startpagina wanneer je het opnieuw wilt proberen. De tweede taak wordt ontgrendeld nadat de eerste is voltooid. Je lees- en oefenvoortgang wordt lokaal opgeslagen, zodat je kunt terugkeren naar onderwerpen die je bent begonnen.

BEWAAR EN DEEL UW WERK

Maak een document, open een opgeslagen HTML-bestand of gebruik 'Opslaan' en 'Opslaan als' om uw werk als HTML-bestand te bewaren. Deel een bestand wanneer u het document zelf wilt verzenden. Voor een online overdracht genereert u een overdrachtscode of deelbare link en gebruikt u de bijbehorende webeditor om verder te werken met het fragment. Online overdracht verzendt de huidige code naar de service en vereist een internetverbinding.

MAAK DE WERKRUIMTE COMFORTABEL

Kies voor een lichte, donkere of systeemweergave en pas de lettergrootte van de editor aan. Met de instellingen kunt u regelnummers, toegankelijkheidsmodus, automatisch opslaan, back-up bij afsluiten en sessieherstel beheren. Concepten en kopieën van de werkruimte zijn lokale app-gegevens; sla belangrijk werk op als bestanden in plaats van een lokale sessie als permanente back-up te beschouwen.

Op de pagina 'Gegevens en privacy' kunt u instellingen bekijken, tijdelijke editorgegevens wissen of lokale app-gegevens resetten. De Beloningshub biedt ook optionele dagelijkse beloningen en op advertenties gebaseerde muntactiviteiten. Beloningsmunten zijn in-app-items, geen contant geld.

Voor het bewerken van afzonderlijke pagina's en het lezen van lesbundels is geen internetverbinding nodig. Externe afbeeldingen, scripts, online overdrachten en advertenties vereisen wel een internetverbinding. Gebruik de HTML-editor om een ​​concept te lezen, een wijziging uit te proberen, het resultaat te bekijken en de code te bewaren waarop u wilt voortbouwen.