Etiqueta dd en HTML

¿Qué es la etiqueta <dd> en HTML?

La etiqueta HTML <dd> se utiliza junto con la etiqueta <dl> (lista de definición) para crear una lista de definiciones en HTML. La etiqueta <dd> se utiliza para proporcionar la definición o descripción de un término o concepto que se ha especificado utilizando la etiqueta <dt>.

Ejemplo de uso

Aquí hay un ejemplo básico de cómo se utiliza la etiqueta <dd> en una lista de definición:


<dl>
  <dt>Término</dt>
  <dd>Definición del término</dd>
  <dt>Otro Término</dt>
  <dd>Otra definición</dd>
</dl>

Lenguaje del código: HTML, XML (xml)

En este ejemplo, la etiqueta <dt> se utiliza para especificar cada término y la etiqueta <dd> se utiliza para proporcionar la definición correspondiente de cada término.

Es importante tener en cuenta que la etiqueta <dd> debe ser un elemento secundario directo de la etiqueta <dl>, y no puede ser un elemento secundario de otra etiqueta <dd> o <dt>.

Atributos

La etiqueta HTML <dd> no tiene atributos específicos en HTML5. Solo hereda los atributos globales que son aplicables a todos los elementos HTML, como “class”, “id”, “style”, “title”, entre otros.

Estos atributos globales se utilizan para proporcionar información adicional sobre el elemento <dd>, como su identificación única en el documento HTML, su estilo visual, su clasificación para el diseño y la funcionalidad, entre otros.

Ejemplo

A continuación, se muestra un ejemplo de cómo se podrían usar algunos atributos globales comunes en una etiqueta <dd>:


<dl>
  <dt>Término</dt>
  <dd class="definicion" id="termino1">Definición del término</dd>
  <dt>Otro Término</dt>
  <dd class="definicion" id="termino2">Otra definición</dd>
</dl>

Lenguaje del código: HTML, XML (xml)

En este ejemplo, se han utilizado los atributos “class” y “id” para aplicar estilos y proporcionar identificación única a los elementos <dd>.

Más ejemplos

Aquí te proporciono 2 ejemplos completos y avanzados de cómo usar la etiqueta <dd> de HTML5:

Ejemplo 1

Lista de definiciones con múltiples términos y descripciones


<!DOCTYPE html>
<html>
<head>
	<title>Ejemplo de uso de la etiqueta &lt;dd&gt;</title>
</head>
<body>
	<h1>Lista de definiciones</h1>
	<dl>
		<dt>HTML</dt>
		<dd>HyperText Markup Language - Lenguaje de marcado de hipertexto</dd>
		<dt>CSS</dt>
		<dd>Cascading Style Sheets - Hojas de estilo en cascada</dd>
		<dt>JS</dt>
		<dd>JavaScript - Lenguaje de programación interpretado</dd>
	</dl>
</body>
</html>

Lenguaje del código: HTML, XML (xml)

En este ejemplo, se utiliza la etiqueta <dl> para definir una lista de definiciones y se utiliza la etiqueta <dt> para especificar cada término.

La etiqueta <dd> se utiliza para proporcionar la definición correspondiente de cada término.

Ejemplo 2

Uso de atributos globales en la etiqueta <dd>


<!DOCTYPE html>
<html>
<head>
	<title>Ejemplo de uso de la etiqueta &lt;dd&gt;</title>
	<style>
		.definicion {
			font-style: italic;
			color: #333;
		}
	</style>
</head>
<body>
	<h1>Lista de definiciones</h1>
	<dl>
		<dt>HTML</dt>
		<dd class="definicion" id="html">HyperText Markup Language - Lenguaje de marcado de hipertexto</dd>
		<dt>CSS</dt>
		<dd class="definicion" id="css">Cascading Style Sheets - Hojas de estilo en cascada</dd>
		<dt>JS</dt>
		<dd class="definicion" id="js">JavaScript - Lenguaje de programación interpretado</dd>
	</dl>
</body>
</html>

Lenguaje del código: HTML, XML (xml)

En este ejemplo, se utiliza la etiqueta <dd> con los atributos “class” y “id” para aplicar estilos y proporcionar identificación única a los elementos <dd>.

También se ha definido un estilo visual adicional en la sección <style> del documento HTML.