HTML y CSS: Estructura, estilo y razonamiento de layout

Apuntes

🧱 A. HTML — ESTRUCTURA Y SIGNIFICADO A1. Estructura base (no cambia) <html> <head> <body> Concepto: Es la estructura mínima obligatoria de un documento HTML. Define que el contenido es una página web, separa metadatos del contenido visible y establece el punto donde comienza lo que el usuario ve. <html> → Contenedor raíz de todo el documento. <head> → Información técnica (no visible). <body> → Contenido visible. A2. Layout semántico (estructura grande) <header> <main> <footer> Concepto: Son etiquetas semánticas de estructura principal. Dividen la página en grandes bloques con significado lógico. <header> → Encabezado (logo, navegación, título principal). <main> → Contenido principal único de la página. <footer> → Pie de página (información final, contacto, copyright). 👉 No dan estilo. Dan significado estructural. A3. Contenedores y organización <section> <article> <div> Concepto: Son etiquetas para organizar contenido interno. <section> → Agrupa contenido relacionado por tema. <article> → Contenido independiente (como una tarjeta o post). <div> → Contenedor genérico sin significado semántico. 👉 Se usan para estructurar, no para diseñar. A4. Texto y contenido <h1> <p> Concepto: S...