Docsity
Docsity

Prepara tus exámenes
Prepara tus exámenes

Prepara tus exámenes y mejora tus resultados gracias a la gran cantidad de recursos disponibles en Docsity


Consigue puntos base para descargar
Consigue puntos base para descargar

Gana puntos ayudando a otros estudiantes o consíguelos activando un Plan Premium


Orientación Universidad
Orientación Universidad


Introducción a CSS: Diseño Web y Estilos, Apuntes de Programación Web y Tecnologías

Una introducción completa a css (cascading style sheets), el lenguaje fundamental para el diseño web. Se explica la estructura básica de css, los métodos de inclusión en html, los tipos de selectores y el modelo de caja. El documento también destaca la importancia de css para la creación de páginas web con una estética uniforme y accesible en distintos dispositivos.

Tipo: Apuntes

2023/2024

Subido el 26/11/2024

sofya-003
sofya-003 🇲🇽

2 documentos

1 / 6

Toggle sidebar

Esta página no es visible en la vista previa

¡No te pierdas las partes importantes!

bg1
CSS (Cascading Style Sheets) es el lenguaje utilizado para describir la presentación y el
diseño visual de un documento escrito en HTML o XML. Al separar el contenido (HTML)
del diseño (CSS), este lenguaje facilita una presentación visual consistente y adaptable
en distintos dispositivos y pantallas.
Introducción a CSS
CSS fue desarrollado por el W3C (World Wide Web Consortium) en 1996, bajo la
dirección de Håkon Wium Lie y Bert Bos, con el objetivo de mejorar la estructura visual
y la estética de los documentos web. En lugar de depender exclusivamente de HTML
para la presentación visual, CSS permite a los desarrolladores aplicar estilos, colores,
tipografías y diseños de manera más flexible y profesional.
El uso de CSS es esencial para el diseño web moderno, ya que permite manejar la
apariencia de los elementos HTML y hacer que el contenido web sea más atractivo y
accesible. Además, CSS mejora la eficiencia del código al permitir que un único archivo
de estilo se aplique en múltiples páginas, centralizando la gestión de diseño y
manteniendo la consistencia en toda la web.
Descripción de CSS
Estructura básica de CSS
Un archivo de estilo CSS está compuesto por selectores y reglas que definen cómo debe
visualizarse cada elemento del documento HTML. La estructura básica de una regla en
CSS es la siguiente:
selector {
propiedad: valor;
}
Cada regla CSS contiene:
Selector: Especifica a qué elementos HTML se aplicará el estilo. Por ejemplo, p
selecciona todos los párrafos, #id selecciona un elemento con un identificador
específico, y .clase selecciona todos los elementos de una clase.
pf3
pf4
pf5

Vista previa parcial del texto

¡Descarga Introducción a CSS: Diseño Web y Estilos y más Apuntes en PDF de Programación Web y Tecnologías solo en Docsity!

CSS (Cascading Style Sheets) es el lenguaje utilizado para describir la presentación y el diseño visual de un documento escrito en HTML o XML. Al separar el contenido (HTML) del diseño (CSS), este lenguaje facilita una presentación visual consistente y adaptable en distintos dispositivos y pantallas.

Introducción a CSS

CSS fue desarrollado por el W3C (World Wide Web Consortium) en 1996, bajo la dirección de Håkon Wium Lie y Bert Bos, con el objetivo de mejorar la estructura visual y la estética de los documentos web. En lugar de depender exclusivamente de HTML para la presentación visual, CSS permite a los desarrolladores aplicar estilos, colores, tipografías y diseños de manera más flexible y profesional. El uso de CSS es esencial para el diseño web moderno, ya que permite manejar la apariencia de los elementos HTML y hacer que el contenido web sea más atractivo y accesible. Además, CSS mejora la eficiencia del código al permitir que un único archivo de estilo se aplique en múltiples páginas, centralizando la gestión de diseño y manteniendo la consistencia en toda la web.

Descripción de CSS

Estructura básica de CSS Un archivo de estilo CSS está compuesto por selectores y reglas que definen cómo debe visualizarse cada elemento del documento HTML. La estructura básica de una regla en CSS es la siguiente: selector { propiedad: valor; } Cada regla CSS contiene:

  • Selector: Especifica a qué elementos HTML se aplicará el estilo. Por ejemplo, p selecciona todos los párrafos, #id selecciona un elemento con un identificador específico, y .clase selecciona todos los elementos de una clase.
  • Propiedad: Define el aspecto que se desea modificar, como el color, la tipografía, el margen, el tamaño, etc.
  • Valor: Especifica el valor de la propiedad, como un color (red), un tamaño de fuente (16px), o una alineación (center).

Métodos de inclusión de CSS en HTML

CSS puede aplicarse a un documento HTML de tres formas principales:

  1. CSS en línea: Se aplica directamente dentro de un elemento HTML mediante el atributo style.

Este es un párrafo estilizado en línea.

2. CSS interno: Se define en el encabezado () del documento HTML, dentro de una etiqueta 3. CSS externo: Se coloca en un archivo CSS separado (por ejemplo, styles.css), que se enlaza al HTML mediante la etiqueta .

La opción más eficiente y recomendada es el uso de CSS externo, ya que permite centralizar el estilo de múltiples páginas en un solo archivo, facilitando la coherencia y el mantenimiento.

Tipos de selectores en CSS

Los selectores en CSS permiten especificar a qué elementos HTML se les aplicarán estilos. Algunos de los selectores básicos son:

HOLA MUNDO con CSS (Interfaz)

Conclusiones

CSS es fundamental en el desarrollo web, ya que permite a los diseñadores y desarrolladores web dar forma a la apariencia y disposición de los elementos HTML. Gracias a la separación entre contenido y estilo, CSS facilita la creación de páginas web con una estética uniforme y accesible en distintos dispositivos. La introducción de CSS3 ha ampliado considerablemente las posibilidades de diseño y animación en la web, impulsando una tendencia hacia interfaces más visuales e interactivas. CSS sigue evolucionando con nuevas herramientas como CSS Grid y CSS Variables, y su integración con JavaScript lo hace una herramienta cada vez más poderosa para el desarrollo de aplicaciones web avanzadas. En el futuro, CSS probablemente seguirá mejorando para soportar nuevas formas de diseño y adaptarse a los dispositivos emergentes.