Este editor de HTML y CSS funciona en el navegador: escribe el HTML arriba, el CSS abajo y mira el resultado al momento, a la derecha. No hay que instalar nada ni crear una cuenta, y el código no sale de tu computadora. Es el mismo editor que abren los enlaces «Ábrelo en el editor» del curso de HTML y CSS.
El resultado se actualiza al escribir.
Cómo se usa
- HTML: basta con el contenido (un
<h1>, unos párrafos…); el editor añade solo el<!doctype html>y la etiqueta<meta viewport>. Si pegas una página completa, con su<head>, también funciona. - CSS: lo que escribas aquí se aplica al resultado como si fuera una hoja de estilos de la página.
- Celular, Tableta y Todo el ancho: cambian el ancho del resultado a 375 px, 768 px o todo el espacio disponible, para ver cómo responden las reglas
@mediay los diseños flexibles. - Formularios y enlaces: el resultado no navega a otra página. Al enviar un formulario verás los datos que se habrían enviado; al pulsar un enlace, la dirección a la que llevaría.
- Copiar enlace: guarda el HTML y el CSS en la propia dirección (después de
#html=). Quien abra el enlace verá tu código; no se guarda en ningún servidor. - JavaScript: un
<script>dentro del HTML se ejecuta, aislado en el marco del resultado, sin acceso a esta página. Para aprender JavaScript tienes el curso de JavaScript.
El resultado lo pinta tu propio navegador, así que puede variar un poco entre Chrome, Firefox y Safari, igual que una página real. Las lecciones del curso indican cuándo una función de CSS es reciente y en qué navegadores funciona. Logotipos de HTML5 (W3C) y CSS3 (Rudloff) en la imagen de la página: Wikimedia Commons, CC BY 3.0.