Comentarios al ejercicio Leyes de Murphy

Etiquetas utilizadas

Al quitar el estilo se puede observar que las etiquetas de bloque utilizadas son <h1> y <p>.

No es necesario crear divisiones alrededor de cada cita, la forma rectangular y el borde se puede dar directamente a cada párrafo <p>.

Clases utilizadas

Cada ley de Murphy tiene un color distinto, así que hay que dar una clase o un id distinto a cada una.

Otros

Al variar el ancho de la ventana se puede observar que el tamaño de los párrafos cambia. Eso indica que su tamaño está definido en porcentaje %.

Cada ley de Murphy está una posición independiente e incluso se superponen. Eso se puede conseguir con posicionamiento absoluto. La posición también está definida en porcentaje %.

La segunda ley de Murphy se superpone al resto. Eso se consigue utilizando la propiedad z-index en la segunda ley de Murphy. No es necesario utilizar la propiedad z-index en el resto de leyes de Murphy, pero si se utiliza, hay que darle un valor más alto a la segunda ley de Murphy.

Al situar el ratón sobre una ley de Murphy, esa ley se superpone a la segunda. Eso se consigue utilizando la propiedad z-index en la pseudo-clase p:hover, dándole un valor superior al que tiene la segunda ley de Murphy.

Solución del ejercicio

El código XHTML del ejercicio puede consultarse abriendo la página web del ejercicio y eligiendo el menú Ver > Código fuente de la página en Firefox o Ver > Código fuente en Internet Explorer.

La hoja de estilo del ejercicio puede consultarse abriendo este enlace a la hoja de estilo del ejercicio.

Tenga en cuenta que en estos ejercicios hay a menudo varias maneras de conseguir lo mismo, por lo que la solución no es nunca única.

Esta obra está bajo una licencia de Creative Commons Reconocimiento-CompartirIgual 3.0 España.