Listado completo de tutoriales

Temario del Tutorial->17 - Lista de definiciones (<dl>)


Como su nombre lo indica se utiliza para asociar un término y la definición del mismo. El navegador se encarga de destacar y separa el término y su definición.

Crearemos una lista con la definición de varios lenguajes de programación:

<!DOCTYPE html>
<html>
<head>
  <title>Título de la página</title>
  <meta charset="UTF-8">
</head>
<body>
  <dl>
    <dt>C++</dt>
    <dd>Es un lenguaje de programación, diseñado a mediados de 
    los años 1980, por Bjarne Stroustrup, como extensión del lenguaje 
    de programación C.</dd>
    <dt>Java</dt>
    <dd>Es un lenguaje de programación orientado a objetos desarrollado 
    por Sun Microsystems a principios de los 90.</dd>
    <dt>JavaScript</dt>
    <dd>Es un lenguaje interpretado, es decir, que no requiere compilación, 
    utilizado principalmente en páginas web, con una sintaxis semejante a la 
    del lenguaje C.</dd>
  </dl>
</body>
</html>

El resultado en el navegador es:

lista de definición dl

Como podemos observar intervienen más etiquetas que en los otros dos tipos de listas. Las marcas que encierran a la lista son <dl> (Definition List) y </dl>

Ahora debemos poner a pares estos dos elementos <dt> (Definition Term) y <dd> (Definition Description)

El navegador se encarga de hacer el sangrado del contenido del elemento dt

Para recordar los nombres de estas etiquetas HTML:

<dl> viene de definition list
<dt> viene de definition term
<dd> viene de definition description

Retornar