Lista desordenada dentro de una lista de definición
Buenas,
estoy dando formato a un texto que contiene enunciados y respuestas, algunos de estos enunciados contienen dos opciones que hay que argumentar.
He decidido utilizar una lista de definición para organizarlo, los términos son los enunciados y las definiciones las respuestas. Las opciones van dentro de listas desordenadas. El problema es que forman parte del enunciado, pero el elemento <dt> no acepta elementos de bloque. Cerrando los <dt> antes de las opciones, e incluyendo estas dentro de elementos <dd>, se consigue el efecto.
Por ejemplo:
<dt>Primera parte del enunciado. Razona las siguientes opciones:</dt>
<dd><ul>
<li>Opción A</li>
<li>Opción B</li>
</ul></dd>
<dt>Segunda parte del enunciado.</dt>
<dd>Respuesta al enunciado</dd>
El aspecto se iguala con CSS, pero la semántica no me convence nada. ¿Cuál seria la forma correcta de hacerlo?
Muchas gracias.
JCMartinez
No he usado nunca las listas de definición, pero según el wiki de w3c esta es la forma de ejemplo:
<dl>
<dt>tarm1</dt>
<dd>difinition1</dd>
<dt>tarm2</dt>
<dd>difinition2</dd>
</dl>
Creo que no necesitas utilizar ningún elemento <ul> ni <li>. Pudes hacerlo así y creo que obtienes el mismo efecto. Pero como ya te he dicho nunca lo he utilizado y no se cuál es la sintaxis correcta.
<dl>
<dt>Primera parte del enunciado. Razona las siguientes opciones:</dt>
<dd>Opción A</dd>
<dd>Opción B</dd>
<dt>Segunda parte del enunciado</dt>
<dd>Respuesta A</dd>
<dd>Respuesta B</dd>
</dl>
Mystral
Como bien apunta JCMartinez, la forma de hacerlo semánticamente es esa, <dl> es la etiqueta que determina una "lista de definición (definition list)", la etiqueta <dt>, hace referencia al término que se va a definir (definition term) y dd a la definición del término (definition).
Con las css le das el aspecto que quieras. Básicamente es la estructura a utilizar para que los lectores de pantalla y demás identifiquen correctamente la clase de información que insertas en las etiquetas y le den el tratamiento adecuado. Muy importante para el tema accesibilidad.
Salu2