Abriremos el archivo de estilo.css y comenzaremos con la edición del mismo para crear el estilo de la página index.
Por principio deberemos crear y establecer parámetros generales con el asterisco, como es el padding y el margin:
luego personalizaremos nuestro título con un H1 le pondremos un fondo negro y texto blanco
luego seleccionaremos nuestra navegación, es decir el espacio donde tendremos el menú. le daremos un fondo, y con ancho del 100% quitar el estilo de lista, y se centrará
a la etiqueta LI de navegación se le pondrá un dispaly, inline-flex par que cada uno de los elementos del menú se recorran, y a los enlaces dentro de los menú se le quitará la decoración para que no se vean la selección del hipervínculo.
En el <nav> a
haremos la función de hover para que cada que pase el curso en la sección este cambie de color.
Para la etiqueta del imagen le daremos un estilo, se agregarán los parámetros de anchos de 200px y altura de 200px y se dará un radio de 50% para que aparezca redonda la imagen se le dará un cover para que se adapte al contenido del marco.
ahora se modificarán los DIV mediante las clase de Contenido. donde se dará un display-flex y un margen del 60px
En tanto los DIV con la clase de artículos se le dará el borde de linea negra para separar el contenido del menú secundario.
ahora el DIV con clases de Secciones se le dará un dispaly- flex y una alineación al centro más un padding para separarlo de las orillas
En tanto en menú secundario se le daría 20% de la anchura de la página y un margin top para separarlo de la barra de navegación este sería de 60px.
Por último a los links del menú secundario se le dará un block para acomodarlos uno sobre otro y una alineación al centro. Con el color en negro, y un margin bottom para separarlo de la parte inferior.
Para la sección de footer se dará en la hoja de estilo, un ancho del 100% y altura de 200px, más el fondo negro. y un margen inferior del 40px
Para darle estilo al párrafo que se pondrá en el footer, se alineará al centro y un padding de 50px
