Scribd
Cargar
8 vistas

Practico 01 - HTML y CSS (Parte I)

El documento detalla un práctico de HTML y CSS que incluye ejercicios básicos, intermedios y avanzados para la creación de un sitio web de un periódico. Se abordan temas como la estructura de un documento HTML, la aplicación de estilos, y la implementación de secciones de noticias con requisitos específicos. Además, se sugieren ejercicios adicionales para mejorar el diseño y corregir errores en el código existente.

Cargado por

Pedro Petersen
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
8 vistas

Practico 01 - HTML y CSS (Parte I)

El documento detalla un práctico de HTML y CSS que incluye ejercicios básicos, intermedios y avanzados para la creación de un sitio web de un periódico. Se abordan temas como la estructura de un documento HTML, la aplicación de estilos, y la implementación de secciones de noticias con requisitos específicos. Además, se sugieren ejercicios adicionales para mejorar el diseño y corregir errores en el código existente.

Cargado por

Pedro Petersen
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 2

Práctico 1 - 2020

HTML+CSS - Parte I
1. ¿Cómo es la estructura de un documento HTML? Investigar para qué sirve cada
sección del documento.

2. ¿Para qué sirven los estilos web? ¿Cómo se aplican los estilos al contenido de una
página web?

3. ¿Qué tipos de selectores existen en CSS? ¿Cuándo conviene usar cada uno de ellos?

Sitio Web de un periódico

BÁSICO
4. Confeccionar la página principal del periódico con las marcas mínimas que debe
tener e incluyendo los elementos:
● <doctype>
● <html>
● <head>
● <body>
5. Colocar un título de nivel 1 al sitio web que funcione como nombre del
periódico.
6. Agregar una hoja de estilos para asignar color y tamaño de la fuente del título.
7. Acceder al código escrito en https://codepen.io/webUnicen/pen/qvJBbj . Detectar
errores y malas prácticas.

INTERMEDIO
8. Confeccionar dos títulos de segundo nivel con los textos Noticias Políticas y
Noticias Deportivas, en cada una de estas secciones definir dos titulares de tercer
nivel con un párrafo cada una que funcionen como resumen de cada noticia.
a. Agregar un titular de cuarto nivel con el pie de página del sitio que incluya el
nombre del periódico y el año actual.

AVANZADO
9. Terminar de implementar las noticias del sitio web que viene realizando. Cada noticia
completa debe cumplir las siguientes consignas.
● Hacer una página diferente para cada una de las noticias.
● Cada noticia debe tener el nombre del periódico y el pie de página al igual que la
página principal.
● Las noticias deben tener imágenes y al menos una debe tener una lista.
● En alguna de las noticias que tengan varios párrafos, aplicar un estilo particular y
diferente a solo uno de ellos.
Práctico 1 - 2020

10. Aplicar estilos al sitio para darle una imagen corporativa. Cada una de las páginas debe
tener una imagen visual unificada. Asigne dentro del sitio colores a las fuentes, diversos
tipos de fuentes, tamaños y estilos de texto. Utilice tamaños relativos de fuentes en las
diferentes secciones del sitio.

Ejercicios Adicionales

INTERMEDIO
12. Agregar a la pagina del periodico el formato de codificación de caracteres UTF-8
(8-bit Unicode Transformation Format).
13. Aplicar un estilo especial al texto que se encuentra en las listas.
14. El periódico decide cambiar su imagen corporativa con una renovación del estilo
visual del diario. ¿Que sugiere al periódico que haga con su sitio web?. Si las noticias
viejas también deben estar con el nuevo estilo que les recomendaría hacer?

AVANZADO
15. Reconocer errores y malas prácticas en el código escrito en
https://codepen.io/webUnicen/pen/moGWQr
16. Transcribir el código del ejercicio anterior para que funcione en su navegador
local, con las correcciones realizadas y modificaciones que crea necesarias.
17. En el proyecto de https://codepen.io/webUnicen/pen/bZQZgx, se ha escrito una
parte del estilo css, pero ha quedado inconcluso. Escriba el archivo html y complete el
estilo css para que la web se vea como lo muestra la siguiente captura del navegador:

También podría gustarte