Cargando...

Div en HTML

Tras block/inline, usamos la caja div para agrupar.

Por qué ayuda una caja «sin significado»

Las tarjetas suelen empezar como div con class.

Respuesta directa

Envuelve marcado relacionado en div, añade class, prefiere semántica cuando el rol es claro.

Un grupo tarjeta

div alrededor de título y párrafo.

Grouping with a card div

html

HTML Code

<div class="card">
<h2>Today</h2>
<p>Practice HTML containers with a simple card.</p>
</div>

Lectura de la tarjeta

div agrupa
h2/p mantienen significado
class = gancho

Contenedor con dos tarjetas

Wrapper exterior e interiores.

Wrapper with two cards

html

HTML Code

<div class="card-row">
<div class="card">
<h3>Lesson</h3>
<p>Read the notes once.</p>
</div>
<div class="card">
<h3>Practice</h3>
<p>Rebuild the markup from memory.</p>
</div>
</div>

Lectura del wrapper

dos niveles bastan
hijos semánticos

Prefiere significado

div es respaldo, no primera opción siempre.

Práctica

Una tarjeta
Dos en un wrapper
Borra divs vacíos
Lista tres etiquetas que no sustituye div

Errores fáciles

sopa de div
div en vez de p/ul/nav
wrappers vacíos

Resumen

contenedor genérico
class como gancho
semántica si es clara
evita la sopa

🧠 Pon a Prueba tu Conocimiento

Listo para Empezar

Pon a Prueba tu Conocimiento

Ponte a prueba con este cuestionario interactivo y descubre qué tan bien entiendes el tema

❓

Preguntas

🎯

70%

Para Aprobar

♾️

∞

Tiempo

🔄

∞

Intentos

📝 Instrucciones

Lee cada pregunta cuidadosamente
Selecciona la mejor respuesta para cada pregunta
Puedes repetir el quiz tantas veces como quieras
Tu progreso se mostrará en la parte superior

Idioma