Resumen de Fundamentos de Excel y HTML

Fundamentos de Excel y HTML: Guía Esencial para Estudiantes

Resumen Test de conocimientos Tarjetas Podcast Mapa mental

Introducción

HTML (HyperText Markup Language) es el lenguaje estándar para crear páginas web. Permite estructurar contenido (texto, imágenes, tablas, enlaces, videos) y definir la semántica de los elementos que el navegador muestra. Este material está diseñado para autoaprendizaje y cubre desde la estructura básica hasta etiquetas y atributos comunes.

Definición: HTML es un lenguaje de marcado que usa etiquetas para definir la estructura y el contenido de las páginas web.

Estructura básica de un documento HTML

La estructura mínima y obligatoria de una página HTML incluye las etiquetas principales que indican al navegador qué mostrar y cómo. Ejemplo:

<html>
  <head>
    <title>Título de la página</title>
  </head>
  <body>
    <!-- Contenido visible aquí -->
  </body>
</html>

Función de cada etiqueta

<html>: Indica el inicio y fin del documento HTML.
<head>: Contiene información no visible directamente en la página (metadatos, título, enlaces a hojas de estilo, scripts).

Definición: La etiqueta <head> agrupa metadatos, el título y recursos que no se muestran en el cuerpo de la página.
<title>: Texto que aparece en la barra o pestaña del navegador.
<body>: Contiene todo el contenido visible: párrafos, imágenes, tablas, enlaces, etc.

💡 Věděli jste?Did you know que el contenido dentro de <head> no se muestra como parte del cuerpo visible, pero es crucial para SEO y accesibilidad?

Etiquetas de texto y formato

Párrafos: <p>Contenido</p>
Saltos de línea: <br>
Negrita: <b> o <strong>
Cursiva: <i> o <em>
Subrayado: <u>
Tamaño y tipo de fuente (antiguo, obsoleto): <font face="Arial" size="3" color="#000000">Texto</font>

Nota: etiquetas como <font> están obsoletas en HTML moderno; se recomienda usar CSS para estilos.

💡 Věděli jste?Fun fact: El navegador ignora espacios y saltos de línea extra en el HTML; para espacios visibles se usan entidades como .

Listas

Listas ordenadas: <ol><li>Item</li></ol>
Listas no ordenadas: <ul><li>Item</li></ul>
Listas de definición: <dl><dt>Término</dt><dd>Definición</dd></dl>

Tablas

Estructura básica:

<table>
  <tr>
    <td>Celda 1</td>
    <td>Celda 2</td>
  </tr>
</table>

Etiquetas importantes: <table>, <tr> (filas), <td> (celdas)
Atributos comunes: border, cellpadding, cellspacing, width, height, bgcolor, align, colspan, rowspan

Tabla comparativa: etiquetas de tabla

Elemento	Uso
<table>	Contenedor de la tabla
<tr>	Define una fila
<td>	Define una celda de datos
colspan / rowspan	Fusionar celdas horizontal/verticalmente

Enlaces (hipervínculos)

Sintaxis: <a href="destino.html">Texto del enlace</a>
Pueden apuntar a páginas internas, externas o secciones dentro de la misma página (anclas):
- Ancla destino: <a name="seccion"></a>
- Enlace a ancla: <a href="#seccion">Ir a sección</a>

Definición: Un hipervínculo es un elemento <a> que dirige al usuario a otra URL o sección de la página mediante el atributo href.

Imágenes

Sintaxis: <img src="ruta.jpg" alt="Texto alternativo" width="400" height="300">
Atributo alt obligatorio para accesibilidad y SEO
Evitar usar estilos y atributos obsoletos; prefiera CSS para bordes, tamaños y alineación

Multimedia (video y audio)

Etiquetas modernas: <video> y <audio> con atributos como src, controls, autoplay, loop, muted, width, height
Ejemplo de video:

<video src="video.mp4" controls width="640" height="360"></video>

Atributos útiles: loop (repetir), autoplay (reproducir automáticamente). No incluyas información sobre música o reproducciones complejas aquí.

Zaregistruj se pro celé shrnutí

TarjetasTest de conocimientosResumenPodcastMapa mental

Empezar gratis

¿Ya tienes cuenta? Iniciar sesión

HTML - Fundamentos

Klíčové pojmy: La estructura básica es <html>, <head>, <title>, <body>, <head> contiene metadatos y recursos, no contenido visible, Usar <a href="..."> para hipervínculos y href para destino, Insertar imágenes con <img src="..." alt="..."> y siempre incluir alt, Crear tablas con <table>, filas <tr> y celdas <td>, Preferir etiquetas semánticas modernas sobre etiquetas obsoletas, Atributos como loop y autoplay se usan en multimedia (video/audio), Evitar <frameset>; usar <iframe> cuando sea necesario, Separar contenido (HTML), presentación (CSS) y comportamiento (JS), Usar listas <ul>, <ol>, y definiciones <dl> correctamente

## Introducción HTML (HyperText Markup Language) es el lenguaje estándar para crear páginas web. Permite estructurar contenido (texto, imágenes, tablas, enlaces, videos) y definir la semántica de los elementos que el navegador muestra. Este material está diseñado para autoaprendizaje y cubre desde la estructura básica hasta etiquetas y atributos comunes. > Definición: HTML es un lenguaje de marcado que usa etiquetas para definir la estructura y el contenido de las páginas web. ## Estructura básica de un documento HTML La estructura mínima y obligatoria de una página HTML incluye las etiquetas principales que indican al navegador qué mostrar y cómo. Ejemplo: ```html <html> <head> <title>Título de la página</title> </head> <body>  </body> </html> ``` ### Función de cada etiqueta - **<html>**: Indica el inicio y fin del documento HTML. - **<head>**: Contiene información no visible directamente en la página (metadatos, título, enlaces a hojas de estilo, scripts). > Definición: La etiqueta <head> agrupa metadatos, el título y recursos que no se muestran en el cuerpo de la página. - **<title>**: Texto que aparece en la barra o pestaña del navegador. - **<body>**: Contiene todo el contenido visible: párrafos, imágenes, tablas, enlaces, etc. Did you know que el contenido dentro de <head> no se muestra como parte del cuerpo visible, pero es crucial para SEO y accesibilidad? ## Etiquetas de texto y formato - Párrafos: <p>Contenido</p> - Saltos de línea: <br> - Negrita: <b> o <strong> - Cursiva: <i> o <em> - Subrayado: <u> - Tamaño y tipo de fuente (antiguo, obsoleto): <font face="Arial" size="3" color="#000000">Texto</font> > Nota: etiquetas como <font> están obsoletas en HTML moderno; se recomienda usar CSS para estilos. Fun fact: El navegador ignora espacios y saltos de línea extra en el HTML; para espacios visibles se usan entidades como  . ## Listas - Listas ordenadas: <ol><li>Item</li></ol> - Listas no ordenadas: <ul><li>Item</li></ul> - Listas de definición: <dl><dt>Término</dt><dd>Definición</dd></dl> ## Tablas - Estructura básica: ```html <table> <tr> <td>Celda 1</td> <td>Celda 2</td> </tr> </table> ``` - Etiquetas importantes: <table>, <tr> (filas), <td> (celdas) - Atributos comunes: border, cellpadding, cellspacing, width, height, bgcolor, align, colspan, rowspan Tabla comparativa: etiquetas de tabla | Elemento | Uso | | --- | --- | | <table> | Contenedor de la tabla | | <tr> | Define una fila | | <td> | Define una celda de datos | | colspan / rowspan | Fusionar celdas horizontal/verticalmente | ## Enlaces (hipervínculos) - Sintaxis: <a href="destino.html">Texto del enlace</a> - Pueden apuntar a páginas internas, externas o secciones dentro de la misma página (anclas): - Ancla destino: <a name="seccion"></a> - Enlace a ancla: <a href="#seccion">Ir a sección</a> > Definición: Un hipervínculo es un elemento <a> que dirige al usuario a otra URL o sección de la página mediante el atributo href. ## Imágenes - Sintaxis: <img src="ruta.jpg" alt="Texto alternativo" width="400" height="300"> - Atributo alt obligatorio para accesibilidad y SEO - Evitar usar estilos y atributos obsoletos; prefiera CSS para bordes, tamaños y alineación ## Multimedia (video y audio) - Etiquetas modernas: <video> y <audio> con atributos como src, controls, autoplay, loop, muted, width, height - Ejemplo de video: ```html <video src="video.mp4" controls width="640" height="360"></video> ``` - Atributos útiles: loop (repetir), autoplay (reproducir automáticamente). No incluyas información sobre música o reproducciones complejas aquí.