Comparto mi resolucion de los ejercicios.

1. Estilizando elementos con clases CSS Explicación: Crear una clase texto-destacado en HTML para un elemento

   , luego en CSS cambiar el color del texto para resaltar el contenido.

Código:

HTML:

Este es un texto destacado.

css Copiar código .texto-destacado { color: #2C3E50; }

1. Destacando títulos con CSS Explicación: Crear una clase titulo-blog y aplicarla a elementos

   para resaltar los títulos de las publicaciones.

Código:

HTML:

Título del Blog

.titulo-blog { color: #2980B9; /* Un azul brillante que destaca */ font-weight: bold; } 3. Estilos situacionales con clases CSS Explicación: Crear una clase urgente para elementos

y estilizarla en CSS para que el texto sea rojo, destacando noticias urgentes.

Código:

HTML:

¡Noticia urgente!

.urgente { color: #E74C3C; /* Rojo brillante para llamar la atención */ font-weight: bold; } 4. Entendiendo y aplicando el reset CSS Explicación: Aplicar un "reset CSS" utilizando el selector universal * para eliminar los márgenes y rellenos predeterminados de todos los elementos.

Código:

CSS:

• { margin: 0; padding: 0; }

1. Inspeccionando elementos y entendiendo el modelo de caja Explicación: Utilizando DevTools, puedes inspeccionar un elemento para ver cómo margin, border, padding, y content afectan su posición y tamaño en la página.

Código: No se requiere código específico, pero usa DevTools de tu navegador para:

Ver el margin como el espacio exterior que separa el elemento de otros. El border es el borde visible del elemento. Padding es el espacio entre el borde y el contenido. Content es el área donde se muestra el texto o imágenes. 6. Aplicando el modelo de caja en la práctica Explicación: Ajusta las propiedades de margen, borde, relleno, y contenido de un párrafo para ver cómo se afecta su disposición en la página.

Código:

CSS: .p-custom { margin: 20px; padding: 15px; border: 2px solid #34495E; background-color: #ECF0F1; } HTML:

Este párrafo tiene un margen, relleno y borde aplicados.