Volver al índiceComentarios al ejercicio Presentación de cdlibre

Etiquetas utilizadas

Al quitar el estilo se puede observar que las etiquetas de bloque utilizadas son <h1>, <h2>, <p>, <address>, <ul>, <li>, <dl>, <dt> y <dd>.

Al quitar el estilo se puede observar que las etiquetas en línea utilizadas son <strong> y <a>.

Al poner el estilo se puede observar que cada apartado forma una ficha, por tanto hay divisiones agrupando cada apartado. También se puede observar que todos los apartados se muestran en una posición determinada (sin barra de desplazamiento, como se observa aumentando el tipo de letra), por tanto hay una división agrupando todos los apartados.

Clases utilizadas

Los apartados son destinos de los enlaces "Anterior" y "Siguiente" situados en cada apartado, así que hay que dar un id distinto a cada división de apartado.

Para posicionar los apartados es necesario dar un id a la división que engloba todos los apartados.

No es necesario dar clase a las divisiones de los apartados para distinguirlas de la división que engloba a todos los apartados. Se puede utilizar el selector de descendientes div div para establecer su estilo.

Para posicionar los enlaces "Anterior" y "Siguiente" es necesario dar una clase a cada párrafo.

Para centrar el párrafo centrado es necesario darle una clase.

Otros

La división que engloba todas los apartados debe tener posicionamiento absoluto. Al modificar el ancho de la ventana se puede observar que la posición y tamaño de esa división están definidos en porcentaje %.

Las divisiones de los apartados deben tener tener posicionamiento relativo para que los párrafos "Anterior" y "Siguiente" se posicionen correctamente en Internet Explorer.

Los párrafos "Anterior" y "Siguiente" tienen posicionamiento absoluto.

No es necesario incluir el <h1> o el <address> dentro de divisiones, se pueden posicionar directamente.

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 página forma parte del curso "Páginas web HTML / XHTML y hojas de estilo CSS" disponible en http://www.mclibre.org
Autor: Bartolomé Sintes Marco
Última modificación: 19 de enero de 2009

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