Comentarios al ejercicio CitasComentarios al ejercicio CitasAl quitar el estilo se puede observar que las únicas etiquetas de bloque utilizadas son <h1> y <p>. Puesto que los párrafos no son todos iguales, es que hay varias clases de párrafos <p>.
El borde que aparece alrededor de cada cita se haría normalmente creando divisiones <div>, pero como este ejercicio se propone antes de haber visto esa etiqueta, se debe hacer sin utilizar divisiones. La solución es darse cuenta de que cada cita tiene dos párrafos:
Si ponemos al primer párrafo un borde por arriba, a la izquierda y a la derecha y al segundo párrafo un borde por abajo, a la izquierda y a la derecha, y ajustamos el margen de los párrafos para que los bordes se unan, podemos conseguir el borde deseado.
A primera vista parece que hacen falta seis clases de párrafos, puesto que hay dos tipos de bordes (por arriba y por abajo) y tres colores distintos, lo que da en total 2 x 3 = 6 combinaciones posibles. Pero se puede reducir el número de clases recordando que un elemento puede tener varias clases. Así, bastaría con cinco clases:
En este caso, no hay mucha diferencia entre hacerlo de una manera u otra (el número de clases sólo se reduce de seis a cinco clases), pero si hubiera cuatro tipos de bordes y cinco colores distintos, la reducción sería muy importante: de 20 clases (4 x 5 combinaciones) a 9 clases (4 + 5).
El código XHTML del ejercicio puede consultarse abriendo la página web del ejercicio y eligiendo el menú en Firefox o 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.
Autor: Bartolomé Sintes Marco