UNIDAD 2: HTML y CSS

¿Que es CSS?

CSS (Cascading Style Sheets) es un lenguaje utilizado para controlar la apariencia y el diseño de los elementos en una página web. Su propósito principal es separar el contenido (HTML) de la presentación, permitiendo que los desarrolladores definan cómo se verá una página sin modificar directamente su estructura.

¿Que hace CSS?

1. Controla el Estilo Visual:

  • Define colores, fuentes, tamaños, márgenes, bordes, espaciados, y más.
  • Permite cambiar el diseño de toda la página desde un único archivo.

2. Diseño y Posicionamiento:

  • Organiza el contenido en una estructura visual coherente.
  • Facilita la creación de diseños responsivos que se adaptan a dispositivos móviles, tabletas y pantallas más grandes.

3. Interactividad y Animaciones:

  • Permite agregar transiciones y animaciones que mejoran la experiencia del usuario.
  • Responde a interacciones del usuario como "hover" o "click".

¿Cómo funciona CSS?

CSS aplica estilos al HTML mediante selectores que apuntan a los elementos del documento. Estos estilos pueden aplicarse de tres formas principales:

1. En línea (Inline):

Los estilos se aplican directamente en el atributo style del elemento HTML.

<p style="color: red;">Este texto es rojo.</p>

2. Internos (Internal):

Los estilos se escriben dentro de una etiqueta <style> en el <head> del documento.

<style>
p {
color: blue;
}
</style>

3. Externos (External):

Los estilos se definen en un archivo separado con extensión .css y se vinculan al HTML con <link>.

<link rel="stylesheet" href="styles.css">

Ventajas de CSS

  • Separación de contenido y diseño: Facilita la gestión de grandes proyectos y el mantenimiento de código.
  • Reutilización: Un solo archivo CSS puede usarse para múltiples páginas.
  • Consistencia: Garantiza un diseño uniforme en todas las páginas de un sitio web.
  • Compatibilidad y accesibilidad: Permite adaptarse a diferentes dispositivos y mejorar la experiencia del usuario.

Obra publicada con Licencia Creative Commons Reconocimiento Compartir igual 4.0

Creado con eXeLearning (Ventana nueva)