La lista de descripciones proporciona una forma semántica de estructurar y presentar información creando una relación entre los términos y sus correspondientes descripciones. Hace que los datos o la información sean más accesibles y comprensibles. Los creadores pueden utilizar listas de descripción en lugares como glosarios, diccionarios, secciones de preguntas frecuentes, especificaciones de productos, etc. Este artículo demuestra el procedimiento para usar una lista de descripción en HTML.
¿Cómo usar la lista de descripción en HTML?
La lista de descripción consta de “ ”, “ ', y ' ” etiquetas y se utiliza para representar una colección de términos y sus correspondientes definiciones. Presenta/muestra el contenido de forma estructurada en la que la descripción va más allá de una simple lista de viñetas. Las propiedades CSS también se pueden aplicar a la lista de descripción para crear una interfaz visualmente atractiva.
Visite el siguiente fragmento de código para crear una lista de descripción en HTML:
< cuerpo >
< división >
< h2 > Cuotas de mercado de portátiles h2 >
< dl >
< dt > caballos de fuerza dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 30 % dd >
< dt > dell dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 24 % dd >
< dt > lenovo dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 14 % dd >
dl >
división >
cuerpo >
La explicación del fragmento de código anterior:
-
- Al principio, el padre “ división Se ha creado un elemento ” que actúa como un contenedor para el elemento de la lista de descripción y otros elementos HTML como “ ”.
- A continuación, la lista de descripción “
- Luego, la descripción nombre/término “ La etiqueta ” se utiliza para definir la descripción de los artículos cuya descripción se va a agregar.
- Después de eso, los datos de descripción “ Se inserta una etiqueta que contiene la descripción/información relacionada con el elemento de descripción.
Después del final de la fase de compilación, los elementos HTML aparecen en la página web de esta manera:
El resultado muestra que se ha generado la lista de descripción.
Ejemplo 1: Asigne múltiples descripciones a un solo término
Se puede crear la tabla de descripción en la que hay más de una descripción para un solo término. Puede ser particularmente útil si hay más de un significado o método por el cual se puede explicar el término de descripción.
El código para el escenario anterior se muestra a continuación:
< división >< h2 > Cuotas de mercado de portátiles h2 >
< dl >
< dt > caballos de fuerza dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 30 % en 2018 dd >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 23 % en 2017 dd >
< dt > dell dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 24 % en 2018 dd >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 27 % en 2017 dd >
< dt > lenovo dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 14 % en 2018 y 9 % en 2017 dd >
dl >
división >
En el código anterior:
-
- Primero, la lista de descripción se crea con la ayuda de “ dl ”, “ dt ' y ' dd ” elementos.
- A continuación, múltiples “ Las etiquetas ” se utilizan bajo un solo “ dt ' elemento. Asigna múltiples descripciones a un solo término.
Después de la fase de compilación:
El resultado muestra que se han agregado múltiples descripciones para un solo término.
Ejemplo 2: Asigne varios términos a una sola descripción
Los desarrolladores también pueden crear una lista de descripciones que consta de varios términos de descripción con datos de descripción únicos. Es especialmente útil cuando varios términos son similares o tienen la misma funcionalidad. Mediante el uso de esta técnica, todos estos términos se pueden describir a la vez:
< división estilo = 'margen: 20px' >< h2 > Cuotas de mercado de portátiles h2 >
< dl >
< dt > caballos de fuerza dt >
< dt > EliteBook dt >
< dt > ProBook dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 30 % en 2018 dd >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 23 % en 2017 dd >
< dt > lenovo dt >
< dd > En la categoría de sistemas de escritorio y portátiles tiene una participación de 14 % en 2018 y 9 % en 2017 dd >
dl >
división >
En el bloque de código anterior, se crea la lista de descripción y múltiples ' Las etiquetas ” se utilizan con un solo “ ' etiqueta.
Después del final de la fase de compilación:
La instantánea anterior muestra que se asignan varios términos con datos de descripción únicos.
Conclusión
La lista de descripción se crea utilizando la lista de descripción “ ” etiqueta que crea el contenedor para los elementos de la lista y su descripción. Además, el “ La etiqueta ” denota el nombre del elemento cuya descripción se proporcionará. Mientras que la ' La etiqueta ” almacena la descripción correspondiente. Este artículo ha demostrado la utilización de una lista de descripción en HTML.