Menú de navegación

CSS (Cascading Style Sheets)

CSS, o Hojas de Estilo en Cascada, es un lenguaje que define la apariencia y el formato de un documento escrito en HTML o XML. Su propósito es
controlar cómo se presentan los elementos en diferentes medios, como pantallas, impresiones o dispositivos de lectura.

Importancia de CSS en el Desarrollo Web

• Diseño Responsivo: CSS permite crear diseños que se adaptan a diferentes tamaños de pantalla y dispositivos.
• Reutilización de Estilos: Los estilos pueden ser reutilizados en múltiples elementos y páginas.
• Personalización: CSS ofrece propiedades para personalizar el diseño según las necesidades del proyecto.
• Optimización de Carga: Reduce el tamaño del código HTML, mejorando los tiempos de carga.
• Soporte para Animaciones: Permite crear animaciones y transiciones dinámicas.
• Estándares Web: Asegura compatibilidad con diferentes navegadores y dispositivos.

En resumen, CSS es fundamental para el desarrollo web, ya que facilita la creación de diseños atractivos, responsivos y consistentes en diferentes plataformas.

JavaScript

JavaScript es un lenguaje de programación versátil que permite agregar interactividad, controlar el comportamiento de las páginas web y desarrollar
aplicaciones completas del lado del cliente y del servidor.

Importancia de JavaScript en el Desarrollo Web

• Interactividad: Permite agregar dinamismo a las páginas web mediante eventos y animaciones.
• Validación de Formularios: Facilita la validación de datos en tiempo real.
• Manipulación del DOM: Permite modificar y actualizar dinámicamente el contenido de las páginas.
• Compatibilidad: Es compatible con todos los navegadores modernos.
• Desarrollo de Aplicaciones: Esencial para construir aplicaciones web interactivas.
• Frameworks y Librerías: Herramientas como React, Angular y Vue facilitan el desarrollo avanzado.

En conclusión, JavaScript es un lenguaje clave en el desarrollo web moderno, proporcionando interactividad, dinamismo y capacidades avanzadas.

Tabla de Estilos (CSS)

Nombre del atributo	Descripción	Valores posibles	Ejemplos de uso	Imagen representativa	Fuente
font-size	Define el tamaño de la fuente del texto.	Valores en px, em, rem, %, etc.	p { font-size: 16px; } h1 { font-size: 2em; }		Enlace
border-radius	Define el radio de las esquinas del elemento.	Valores en px, %, etc.	div { border-radius: 10px; }		Enlace
display	Define cómo se debe mostrar un elemento.	block, inline, flex, grid, etc.	div { display: block; } span { display: inline; }		Enlace
flexbox (display: flex)	Define un contenedor flexible.	flex, inline-flex	div { display: flex; }		Enlace
position	Define cómo se posiciona un elemento en el documento.	static, relative, absolute, fixed, sticky	div { position: absolute; }		Enlace
box-shadow	Aplica una sombra a un elemento.	Valores en px, color, etc.	div { box-shadow: 10px 10px 5px #888888; }		Enlace
overflow	Define qué hacer con el contenido desbordado de un elemento.	visible, hidden, scroll, auto	div { overflow: hidden; }		Enlace
z-index	Define el orden de apilamiento de los elementos posicionados.	Valores numéricos	div { z-index: 10; }		Enlace
opacity	Define la opacidad de un elemento.	Valores entre 0 y 1	div { opacity: 0.5; }		Enlace
margin	Define el margen exterior de un elemento.	Valores en px, %, auto, etc.	div { margin: 20px; }		Enlace
padding	Define el relleno interior de un elemento.	Valores en px, %, etc.	div { padding: 20px; }		Enlace
text-align	Define la alineación horizontal del texto dentro de un elemento.	left, right, center, justify	p { text-align: center; }		Enlace
line-height	Define la altura de la línea del texto.	Valores en px, em, %, normal	p { line-height: 1.5; }		Enlace
border	Define el estilo, ancho y color del borde de un elemento.	Valores como solid, dashed, 1px, #000, etc.	div { border: 1px solid #000; }		Enlace
cursor	Define el tipo de cursor que se muestra al pasar sobre un elemento.	pointer, default, text, move, etc.	a { cursor: pointer; }		Enlace