CREACIÓN DE UN SITIO WEB CON HTML5 Y CSS3
Enviado por mondoro • 21 de Abril de 2018 • 876 Palabras (4 Páginas) • 381 Visitas
...
[pic 12]
[pic 13]
Con este estilo el encabezado va tomando forma, pero falta que tanto la imagen como el título queden en la misma línea del encabezado.
[pic 14]
[pic 15]
A continuación se le cambia el color al texto del título, su tamaño de imagen y adicional a ello se le asigna una sombra.
A la imagen se le asignara un margen de 0.5em en todos sus lados.
[pic 16]
[pic 17]
A continuación se modificara el menú. Para ello al igual que al header se asigna un color de fondo, un borde redondeado un margen y el ancho, adicional a ello, se agregara una sombra.
[pic 18]
[pic 19]
A continuación se elimina la viñeta de la lista.
[pic 20]
[pic 21]
A continuación, se le asigna a cada uno de los ítems la propiedad display inline_block, de tal forma que todos los elementos queden en el mismo renglon, adicional a ello, se alinean con respecto al borde superior.
[pic 22]
[pic 23]
Ahora se modificara el selector a dentro del nav, asignándole un color blanco y en negrilla al texto, una disposición en bloque, un borde interno y se le elimina la línea de subrayado.
[pic 24]
[pic 25]
Para finalizar, se le modificara el color cuando el usuario pase el puntero del ratón sobre alguno de los enlaces.
[pic 26]
[pic 27]
Ahora vamos a configurar el contenido. Para ello debemos primero asignarle un margen y un ancho al section contenido.
[pic 28]
Ahora configuraran el section principal asignándole un color de fondo blanco, unos bordes redondeados, el display inline-block, un ancho máximo del 100%v un pading, auna alineación vertical y un ancho correspondiente al 65% del section contenido.
[pic 29]
[pic 30]
A continuación se le aplican los estilos a h2 como se muestra a continuación.
[pic 31]
[pic 32]
Para que los párrafos queden rodeando la imagen es necesario asignare a esta una flotación a la izquierda, además de un max-width.
[pic 33]
[pic 34]
A continuación se modificara el aside, el cual tiene dentro dos section. Este aside tendrá los siguientes estilos.
[pic 35]
Los sections dentro del aside tendrán los siguientes estilos.
[pic 36]
[pic 37]
La guía va hasta este punto, de aquí en adelante, deberán aplicar estilos para mejorar los section dentro del aside, de tal forma que quede con una estructura visualmente bonita, y también deberán asignar los estilos para mejorar el pie de página.
...