Actividad 5
Efectos Visuales

Curso WEBCSS

Bloque I

Cabecera

Para definir la cabecera del texto, hemos creado una caja general llamada cabecera. Dentro de esta, aparecen dos nuevos elementos mas, que son la peuqeña caja de la izquierda y la caja mayor de la derecha donde se identifica el CURSO ECOWEB.

Estas cajas se posicionan como absolute, referidas por tanto a la definición del body hecha previamente. Cada caja se ubican dentro de la cabecera con dimensiones especificadas en porcentajes de la caja padre.

Bloque II

Indice

El índice se sitúa en otra caja que denomino menu. Dentro de esta caja establezco parámetros diferentes en función de la importancia del elemento del índice.

Los apartados del escrito se definen en capitulos_menu y los bloques de contenido en apartados_menu.

El ancho del elemento indice es de 20% y su posicionamiento absoluto. Los enlaces modifican su tamaño y color al ser seleccionados.

Bloque III

Cuerpo

El cuerpo es definido en el elemento central, se posiciona en valor absoluto y el tamaño se consigue definiendo su ancho en porcentajes y su altura en pixeles pues las cajas restantes tienen sus alturas definidas en pixeles también.

Para conseguir que el texto que se presente en este cuerpo central no se ubique próximo al borde superior, se define margin-top de 40 pixeles que afecta a todo texto mostrado en este elemento.

Bloque IV

Pie

El bloque pie se define en el elemento de estilo llamado pie, que tiene posición absoluta, ancho en porcentaje del elemento padre body y altura en pixeles pues todas las alturas de las cajas restantes fueron también definidas en pixeles anteriormente.