HTML Editor
The iwantcoding.com Tryit Editor is a split-pane sandbox that runs every example in this tutorial. Edit the code on the left, see the result on the right.
Editor features
| Feature | How it works |
|---|---|
| Syntax highlighting | Powered by CodeMirror. Colours match the language of the lesson (HTML, CSS, JS, PHP). |
| Run | Click Run » or press Ctrl+Enter / Cmd+Enter. |
| Reset | Restores the original example. |
| Sandboxed preview | The right pane is an iframe with sandbox="allow-scripts" — your code can't touch the parent page. |
| Line numbers + bracket matching | Built into the editor. |
| Auto-close tags | Type <p> and the editor adds </p>. |
Keyboard shortcuts
| Shortcut | Action |
|---|---|
| Ctrl/Cmd + Enter | Run the code. |
| Tab | Indent the current line. |
| Shift + Tab | Outdent. |
| Ctrl/Cmd + F | Find inside the editor. |
| Ctrl/Cmd + Z | Undo. |
Tip: The editor falls back to a plain textarea if the CodeMirror CDN is blocked — every feature still works, just without coloured tokens.
Example
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML Editor</title>
</head>
<body>
<h1>HTML Editor</h1>
<p>This is a demo page for the "HTML Editor" lesson.</p>
</body>
</html>
Try it Yourself »
Exercise
Type the URL segment that loads the in-browser playground.
/w3schools/public/
/{track}/{topic}
Five lowercase letters, no hyphen.
Discussion
Loading…